CODEWITHSUNDEEP
javascripthtmljqueryjquery-mobileradio-button
askrich
askrich

Reputation: 598

jQueryMobile radio buttons when clicked generates errors

I'm using jQuery mobile 1.4.2 and I'm experiencing some extremely annoying issues with the radio buttons. The issue being that they don't work.

I've scoured the internet, and not managed to find a solution; so maybe other people are not having this issue as well as me. I do think however that I'm doing everything "right", so hopefully this question can help others if they experience the issue too.

The outputted HTML for the page can be found here, but the code used to generate it is:

<form method="post" action="/category/log">
    <input type="hidden" name="id" value="<%: Model.CurrentCategory.Id %>" />

    <div data-role="controlgroup">
        <% Dim elementId = "personId"%>
        <% For Each e In Model.Engineers%>
            <% Dim formattedId = elementId & "-" & e.Id%>
            <input type="radio" name="<%:elementId %>" id="<%:formattedId %>" value="<%:e.Id %>" />
            <label for="<%:formattedId %>"><%:e.Name%></label>
        <%Next%>
    </div>

    <input type="submit" value="Log Visit" />
</form>

When a radio button is clicked, the following error is generated: Uncaught TypeError: Object #<HTMLInputElement> has no method 'substring'

It reports this occurs in: jquery.mobile-1.4.2.js:2656

An image of this can be found here: Object #<HTMLInputElement> has no method 'substring'

If anyone can help that would be great, and if anyone else is having this issue, hopefully this will help them also.

Thanks,

Upvotes: 0

Views: 218

Answers (2)

Daweb
Daweb

Reputation: 84

I've same problem (Only with jqm v1.4.2, not with jqm v1.4.0).

The origin of the problem is the presence of the hidden input field in the form.

Problem happens in $.mobile.path.hashToSelector(hash) and is due to the fact that an object (the hidden input field) is passed as parameter and then the substring function is applied to this object.

Following hack solves the problem (file jquery.mobile-1.4.2.js, line 2654)

        // Escape weird characters in the hash if it is to be used as a selector
        hashToSelector: function( hash ) {

            /* Hack begin */
            if(typeof hash != "string") return hash;
            /* Hack end */

            var hasHash = ( hash.substring( 0, 1 ) === "#" );
            if ( hasHash ) {
                hash = hash.substring( 1 );
            }
            return ( hasHash ? "#" : "" ) + hash.replace( /([!"#$%&'()*+,./:;<=>?@[\]^`{|}~])/g, "\\$1" );
        },

But I don't know if this hack can generate another problem elsewhere in the code (better not to modify an original librairy anyway).

As said above, git version (1.5-pre) of jqm solves the problem as you can see in http://jsfiddle.net/4uBqW/5/ (to compare, this http://jsfiddle.net/4uBqW/6/ is with jqm 1.4.2 and as the problem)

Upvotes: 0

Chris Porter
Chris Porter

Reputation: 2449

I don't know what the problem was but the latest version seems to fix it:

http://code.jquery.com/mobile/git/jquery.mobile-git.js

Upvotes: 1

Related Questions