Saturday, July 27, 2013

SubmitName issue while creating Name Attribute in IE using jQuery

A few days back I saw that one of my jQuery selector wasn't working in IE. We were using "Name" attribute to make the selection. 
Example: $('input[name="someName"]').val();

But, hold on!! We had been using "Name" attribute for selecting DOM element for such a long time and how come we never saw this issue!! 

I then tried to select few other elements in the same DOM having "Name" attribute using Developer tools console window (Pressing F12 in IE should take you to Developer tools). Ah, it works like a charm. So the issue is with just that INPUT element. 

After closely inspecting the element and it's attribute, I found that there is no "Name" attribute to it and, we have an attribute called "SubmitName" (ever heard of this :) ?? )

Also after inspecting the jQuery code, I found that we were creating this INPUT element dynamically and appending it to the form. 

$("< input/>", {
            type: "hidden",
            name: name,
            value: "somevalue"}).appendTo($form);

Except for IE, in all other browsers we have the attribute as "Name" and not "SubmitName". As always no wonder if IE does things differently (read it as "IE has issues"). 

Wondered, would it  be worth to create the dynamic INPUT element in a different way maybe something like:

var input = $('< input type="hidden" ' + 'name="' + name + '" value="someValue"/>');
            $(input).appendTo($form);

Bingo!! We have the "Name" attribute now, and the selector works like a charm.

Summary:

If you are dynamically creating an element using jQuery and setting its "Name" attribute, Internet Explorer will render it as submitName and not Name.

Hope this helps someone!!




Saturday, March 2, 2013

Safari on iOS 6 caching $.ajax results?

If your web application serves iphone/iPad users (with iOS 6), the below is one of the issue you could see:

I one of the application that I was working on, we saw that the information were not returned back from the ajax call back to the UI. But we could see that from the ASP.NET MVC application the results were being sent back. It was just that the UI wouldnt refresh!!  

We use $.ajax (jQuery) call to perform Refresh operation (to poll and get the results back to the UI). And  I always believed that a POST action would never be cached. Either call it  Over engineering or, User experience here you have!! Safari browser (iOS 6) caching your results (In our case the application was returning back “no data” for first couple of poll and, safari cached that result).

It’s been argued that this is actually a bug in iOS6 and not a feature.

The W3 spec says:

“Responses to [POST] are not cacheable, unless the response includes appropriate Cache-Control or Expires header fields.”

But apple is caching everything unless you say otherwise – the exact opposite of the spec. *sigh*


So you have few options to resolve this:

1) One solution is to check the cache-control directive in response header served up by your application. It should be set to no-cache. It is this that tells the client (and any intermediate proxy servers whether the response can be cached).
2)  Set cache-control to “no-cache” and, Cache =false in your ajax call request. With this being set, iOS6 safari won’t cache your response.
3)   Change your post data every time you poll, like passing random data (Time for example) would also prevent the result being cached (Sounds more like a Hack rather than solution).

Check the post for more information. Hope this would save someone few hours of agony.

Happy Debugging!!

Monday, January 14, 2013

No Inspectable Applications: iPhone remote debugging not working

Today I was trying to remote debug a web app on iphone using Mac safari browser. When navigating to Develop -> iPhone I was seeing the message "No Inspectable Applications" and unable to debug the application.

Note I was using an iPhone with IOS 6. After much of hair pulling, I figured it out to be the Private browsing setting on iPhone which was switched "ON". I was able to debug the applicaiton once I turned this "OFF". You can turn it off by navigate to Settings -> Safari -> Private browsing.

Happy Debugging!!