locked
data-win-bind special characters in binding name

    Question

  • Hi,

    I'm trying to bind a json result from a web service but the json data contains object names with special characters for example te-, te+, etc.

    When I specify a special character in the data-win-bind parameter I always get an error:

    <span data-win-bind="innerText: te-"></span>
    How can bind these names ? I don't have control over the json response from the webservice.

    Monday, October 27, 2014 7:21 AM

Answers

  • Hi Matt,

    I already found a workaround by just doing a string replace of the special characters before parsing the json response. Pretty obvious workaround actually :-)

    Thx

    Friday, October 31, 2014 9:08 PM

All replies

  • Hi Robby - I'm not familiar with this area at all. Can you help walk me through how you're expecting this to work, and then I can try to get this figured out?

    Matt Small - Microsoft Escalation Engineer - Forum Moderator
    If my reply answers your question, please mark this post as answered.

    NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.

    Monday, October 27, 2014 7:30 PM
    Moderator
  • Hi,

    I created a binding template which is bind to the json result of a webservice:

    <div id="thermometerTemplate" data-win-control="WinJS.Binding.Template">
                            <div class="container">
                                <span id="temp" data-win-bind="innerText: te hubPage.convertNullToZero"></span>°C
                                <span data-win-res="{ 'innerText': 'TempMin' }"></span>
                                <span data-win-bind="innerText: te hubPage.convertNullToZero"></span>°C <span data-win-bind="innerText: te-"></span><br />
                                <span data-win-res="{ 'innerText': 'TempMax' }"></span>
                                <span data-win-bind="innerText: te hubPage.convertNullToZero"></span>°C <span data-win-bind="innerText: te+"></span><br />
                            </div>
                        </div>
                        <div id="thermometerContainer"></div>

    The binding is done like this:

    var baseURI = "http://<web service url>";
                WinJS.xhr({
                    type: "get",
                    url: baseURI,
                    headers: { "Content-type": "application/json" }
                }).then(function (r) {
                    if (r.responseText == null) {
                        //TODO error handling
                    }
                    else {
                        var result = JSON.parse(r.responseText);
    
                        // Thermometers
                        var thermometers = result.response.thermometers;
                        for (var i = 0; i < thermometers.length; i++) {
                            document.querySelector('#thermometerTemplate').winControl.render(thermometers[i], document.querySelector('#thermometerContainer'));
                        }
                    }
                });

    The json response from the webservice:

    {"status": "ok", "response": {"thermometers": [{"id":0,"name":"Temp","te":15.7,"hu":69,"favorite":"no","channel":2,"te+":15.7,"te+t":"09:41","hu+":86,"hu+t":"08:17","te-":4.9,"te-t":"08:17","hu-":69,"hu-t":"09:33","outside":"no"}]}}

    As you can see in the json response, the name of some objects contain - and + characters (for example te+ and te-) but if I try to use these object names in the binding template this generates an error.

    Tuesday, October 28, 2014 7:49 AM
  • Please post a project which duplicates this problem, and I'll file a bug for it.

    Matt Small - Microsoft Escalation Engineer - Forum Moderator
    If my reply answers your question, please mark this post as answered.

    NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.

    Friday, October 31, 2014 2:33 PM
    Moderator
  • Hi Matt,

    I already found a workaround by just doing a string replace of the special characters before parsing the json response. Pretty obvious workaround actually :-)

    Thx

    Friday, October 31, 2014 9:08 PM