Correct markup for grid headers?

1 posts, 0 answers
  1. Tina
    Tina avatar
    7 posts
    Member since:
    Apr 2011

    Posted 02 Aug 2012 Link to this post

    What's the proper markup for the column titles to bind them to a variable?  Basically, I'm looking to localize the column titles pulling them from a resource file.  My only problem is figuring the correct markup to display the header.

    I know this works
    <div id="CityCodeGridView" data-role="grid" data-bind="source: gridDataSource" data-sortable="true"
           data-editable="true" data-toolbar='["save", "cancel"]' data-columns='[{"field": "CityAlpha", "title": "city code" },
                                                                                        {"field": "CityNumeric", "title": "iata city code"},
                                                                                        {"field": "Description", "title": "description"},
                                                                                        {"field": "NextFlightEnabled", "title": "next flight enabled"},
                                                                                        {"command": "destroy"}]'
           data-scrollable="false">
        
    </div>

    but I'm looking for something like this
    <div id="CityCodeGridView" data-role="grid" data-bind="source: gridDataSource" data-sortable="true"
           data-editable="true" data-toolbar='["save", "cancel"]' data-columns='[{"field": "CityAlpha", "title": userMsgs.CityCode },
                                                                                        {"field": "CityNumeric", "title": userMsgs.IataCityCode},
                                                                                        {"field": "Description", "title": userMsgs.Description},
                                                                                        {"field": "NextFlightEnabled", "title": userMsgs.NextFlightEnabled},
                                                                                        {"command": "destroy"}]'
           data-scrollable="false">
        
    </div>
    where the title is a member property.  Thanks.
Back to Top