Jquery val() not working in ie for dynamically added option

Question 1

Question by rahul

i am generating options for my dropdown by jquery ajax method, filling it by db.

$.ajax({
        type: "POST",
        url: pageUrl + '/FillAssignee',
        data: {},
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (response) {
                        for (var i = 0; i < response.d.length; i++) {
                            $('#SelectAssignee').append($("<option></option>").val(response.d[i]['Value']).html(response.d[i]['Text']));
                        }
                  }            
      });

it’s works fine. only problem is that first value not got selected by default on ie. so for that i used many options

1. $('#SelectAssignee").val();
2. $('#SelectAssignee option:first').attr('selected','selected');
3. $('#SelectAssignee option:first').prop('selected',true);

how to get it work please help me out.

Thanks in advance.

Answer

Answer by Starx

Starx

Try setting as attributes rather than properties.

$('#SelectAssignee').append($("<option />", { value: response.d[i]['Value'], html: response.d[i]['Text'] }));

Question 2

Question by Richard

Richard

I have been developing a game in the HTML5/Javascript new canvas feature, and all is going great, until I started to test it on Internet Explorer 9. So I will vaguely ask, are there any tips on getting the game to work fully in IE9?

Here’s what I know:

1) I must include

<!DOCTYPE html5>

else IE9 cannot possibly figure out that I indeed intend to use HTML5, and not an older version.

2) IE9 must be explicity told to run in IE9 mode, and not in IE8 mode, since clearly everyone who upgrades to IE9 intends to run it in IE8 mode by default.

3) .ttf files make IE9 unhappy. This is a problem, because the font files that DO work with IE9 (namely, .eof) seem to be disregarded by Firefox and other real browsers. Any tips of getting this fixed?

4) Finally, my biggest problem, after getting all else to work: only SOME of the graphics get drawn to the screen. In short, the game’s “engine” is split into several systems. Some, such as the particles (basically, just a collection of moving spheres) are draw, while others, such as all of the sprites, are not drawn, but the health bar is drawn. They all use the same exact draw methods, so I really can’t wrap my head around why some work and some don’t. There’s a lot of stuff to draw, but again, real browsers handle it just fine.

I know this is vague, but I’m just hoping somebody has some experience with this and can link me to a proper tutorial or else give me a hint as to how I can go about fixing this. It seems to be a project all its own just to get IE9 to run the code that works perfectly on Firefox, Safari, Chrome and Opera. Thanks, all help is very much appreciated.

Answer

Answer by Joseph the Dreamer

Joseph the Dreamer

<!DOCTYPE html> only tells the browser to use standards mode. HTML5 was built to fail gracefully incase the browser supports it. An example is the datepicker input which gracefully fails on all browsers (except Opera which supports it) as a text type input.

The DOCTYPE is retained in HTML5 as a “mostly useless, but required” header only to trigger “standards mode” in common browsers.

The doctype does not tell the browser what version of HTML. That’s the DTD’s job. The DTD just tells the browser what’s valid markup in your markup. It’s only used in validation to determine what HTML you use (HTML or XHTML; loose, transitional or strict). In HTML5’s case, there is no DTD because there’s no use for it.
You can force IE to render in it’s latest mode or in chrome frame with a meta command, but it’s usually unnecessary. Declaring strict mode using the doctype as well as using proper markup is enough to do the job.
```
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
```
Paul Irish’s bulletproof @fontface syntax should put your fonts in an “all-in-one” syntax so that the same code can be loaded on all browsers.
I don’t know about you but IE9+ has basic support and text support for canvas which is at par with the browsers of it’s age. IE even has it’s own testdrive page for versions 9 and up to show off their HTML5 support. There must be something wrong with your code.

Answer

Answer by Starx

Starx

HTML5 is already supported my IE9. Here is an example of it. Be sure check the developers guide while doing this.

Question 3

Question by mikez302

mikez302

The Javascript reset method for forms is not supposed to affect hidden inputs, but in IE8 and IE7 it does anyway. Does anyone know a way to make it behave properly?

I know I can do it by looping through individual inputs or by remembering the values before resetting the form and then restoring them but I am wondering if anyone can come up with a simpler way. Feel free to use jQuery if it will make your solution simpler. You can see an example at http://jsfiddle.net/Ddtz4/.

According to the author of the plugin, this is supposedly not an IE bug and the effect of the reset method on elements without initial values is undefined.

Answer

Answer by mikez302

mikez302

I am thinking of something like this, using jQuery:

$(document).delegate("form", "resetForm", function() {
    $(this).find("input[type=hidden]").each(function() {
        $(this).prop("defaultValue", $(this).val());
    });
    this.reset();
});

Whenever I want to reset a form, I can do this:

$("#whateverForm").trigger("resetForm");

Answer

Answer by Starx

Starx

The following snippet seem to be working for IE8 too

$("#testInput").val('foo');
$("#testForm")[0].reset();
$("#result").html($("#testInput").val());

Update:

Why dont you create a custom reset function() instead:

$("#resetbutton").on("click", function() {
    var form = $(this).closest('form');
    form.find("input:not(:hidden)").val('');
    form.find("select").prop('selected', false);
    // so on

});

Question 4

Question by user983327

user983327

I have placed a Div on top of an img tag. In my example the Div with cls ‘justForClickCls’ is placed on top of an img which is wrapped in another div ‘gameBoardElementGreyCls’. The mousedown on the ‘justForClickCls’ div is not firing in IE. However it works in every other browser.

Here is the code. Any help is much appreciated. By the way i’m testing it i IE 9

<div class='gameBoardElementCls'>
    <div id='9' class='justForClickCls' style='z-index:10;position:absolute;margin:20px;width:80px;height:80px;'></div>
    <div class='gameBoardElementGreyCls'><img src='img/greygmelement.png' width='110px' height='110px'></img></div>
</div>

<script>
    $("div.justForClickCls").mousedown(function () {
        alert('clicked 1');
    });
</script>

Answer

Answer by Starx

Starx

First thing you should fix is the closing tag in the img

<img src='img/greygmelement.png' width='110px' height='110px'></img>

To

<img src='img/greygmelement.png' width='110px' height='110px' />

Next, mousedown seems unnecessary since you are trying to trap the click. Simple use click instead of mousedown.

Now check this demo of you coding, which is working

Question 5

Question by Ted

Ted

While using cURL with some site, I noticed that some files that I requested actually used several variables from the cookie I set up with curl.

Here’s a snapshot:

enter image description here

But when I check my cookie file all it reads is just one value for ASP.NET_SessionId:

www.*******.***  FALSE  /  FALSE  0  ASP.NET_SessionId  ddj24l55lfu11nb1lhuflw55

Of course, the values from the snapshot are taken from my browser (Internet Explorer F12), and that cookie contains Three variables (not one).
Internet Explorer F12 cookie variables Name/Values:

NAME  ASPSESSIONIDSACRDADD 
VALUE  LOONCEMDHCGEJOANEGHHFAFH 

NAME  ASPSESSIONIDSCBRABDC 
VALUE  CMONJEMDNICPNPNFICLAPMFM 

NAME  ASPSESSIONIDQACSBADC 
VALUE  MCBOGLCCKNIDDBOADNMPCLCD

this is my CURL settings for cookies:

$cookiefile = "d:/cookie.txt";

curl_setopt($curl, CURLOPT_COOKIESESSION, 1);
curl_setopt($curl, CURLOPT_COOKIEFILE, $cookiefile);
curl_setopt($curl, CURLOPT_COOKIEJAR, $cookiefile);

What is it that I may be missingin cURL ?

Thanks!

Answer

Answer by Starx

Starx

By the nature of the div collection, it looks to be like variables are from different browser sessions.

And Even if its not, its up to developer on how to create your application to set and read the data.

Question 6

Question by CCrawler

CCrawler

I tried several methods, none seem to work:

1 (I tried this one with other elements and it doesn’t work either):

$('#container').append('<object attribute="value"></object>');

2 (I found that this way worked with IE with most elements, but no luck here) :

var newSwf = $('<object></object>').attr('attribute', 'value');
$('#container').append(newSwf); //appendTo doesn't work either

None of the above seems to have any effect on the DOM, like nothing is appending at all. I know IE works funny with the append function, but until now, I always managed to find a workaround. I have no clue with this one though. Any ideas?

EDIT:

It seems it was my mistake, something else on my code was causing the problem in IE. I’m terribly sorry, I was hiting against a wall and I thought it was some sort of .append() issue, since IE always works funny with that.

The second method worked, as it does with other elements.

Answer

Answer by Starx

Starx

As mentioned in my comment, it works on IE 8+. But in case they are not, stick to native JavaScript for this

var newobject = document.createElement('object')
newobject.setAttribute('id','objectid');
document.getElementById("container").appendChild(newobject);

Demo

Question 7

Question by user1089964

user1089964

I am getting a problem when I am trying to invoke the $.ajax() method in Internet Explorer.

My code is:

$.ajax({
    type: "GET",
    url: "http://my_server/resource.php",
    success: my_function
});

When I am testing this in any browser I get the proper answer, but if I’m using Internet Explorer, it only takes the url: http://my_server/ where the resource.php part is left out and the response is empty.

Any suggestions? Should I send the resource.php part in the data field?

Answer

Answer by Starx

Starx

Yes, it DOES work

If that’s your current code, then there is incorrect definition of function . You have to use

success: function() { 
//.....
}

Question 8

Question by Aaron

Aaron

I’m experiencing issues with IE (of course) and jQuery UI. I’m animating the background color and everything works fine in all other browsers, but for some reason IE flashes different colors while animating. It does the actual background color animation, but is a horrible transition. A ton of different colors randomly flash in during the transition. Has anyone experienced this issue before? Thanks!

Answer

Answer by Starx

Starx

Sometimes, for color transition, jQuery Color Plugin does the job much better. Find it here.

Regarding your question, unless you show some codes, can’t help you debug that.

Question 9

Question by GuyFromOverThere

GuyFromOverThere

i made my site with Jquery and now if i test it in an old IE version like 5.5 and 6 it completely is filled with errors in javascript. is there a way of getting this problem to stop… and is that error in jquery?

Answer

Answer by WTK

WTK

Currently as others have already stated, jQuery doesn’t support IE in version less than 6.

BUT, according to this thread back from 2006 (post by John Resig so it should be legit source), jQuery was compatibile with IE 5.5+ in 2006, meaning (based on this history) that you can try to get it working on jQuery 1.0.

Answer

Answer by Starx

Starx

No and Yes both!

No!, because those old browsers, are so outdated, that they do not recognize the new methods and functions.

Yes!, because JQuery is only compatible above IE 6, not IE 5.5, so most the codes may not work in IE 5.5, as it should.

Question 10

Question by BHare

BHare

There are a lot of JQuery plugins to give rounded corners to browsers that dont support CSS3. They either don’t work or have an ugly effect where you see it unstyled, and then the JS kicks in and finally makes them rounded.

I am looking for a solution that renders rounded corners before visibility, looking for a seamless, or near seamless solution.

The best match I have come to so far if the use of .htc files with www.css3pie.com. There is still that delay (Not sure if it can even be solved).

css3pie is around 26k compressed, the owner stated that if you have JQuery there could be scripts that would be less. (I plan on using JQuery throughout anyways).

Ideally, I’d like it to support gradients, border-radius, and box-shadow. Currently css3pie does all of this how I need, except for box-shadowing. It messes up if the background is transparent as indicated here: http://github.com/lojjic/PIE/issues#issue/12

I am willing to accept inability of any of these features in IE6.

I guess maybe I just can’t have one’s cake and eat it too. For now, I will be sticking with css3pie.com and putting up with annoying delay, and not allowing for box-shadow in IE. Not a huge deal because IE9 is suppose to fix that -crossing fingers-

Answer

Answer by Erik

Erik

The CSS3 PIE library handles a lot of things for IE6/7/8 including:

Border Radius (rounded corner)
Box Shadow
Border Image
Gradient Backgrounds

Its pretty handy.

Answer

Answer by Starx

Starx

Use jquery rounded corner plugin

http://jquery.malsup.com/corner/

And trigger the plugin in every possible events to ensure its loaded

<script>
   $(this).corner(); //This will trigger the function as soon as this line loads
   $(document).ready(function() { $(this).corner(); }); //not necessary
   $(window).load(function() { $(this).corner(); });//not necessary
</script>

Tag: internet-explorer

Jquery val() not working in ie for dynamically added option

Question by rahul

Answer by Starx

Are there any tips on getting HTML5 canvas to work in IE9?

Question by Richard

Answer by Joseph the Dreamer

Answer by Starx

Simplest way to prevent form reset method from clearing hidden inputs in IE8

Question by mikez302

Answer by mikez302

Answer by Starx

Mousedown event not fired on a Div if the Div is placed on top of an img tag – issue is only in IE

Question by user983327

Answer by Starx

How many vars should there be in a cookie?

Question by Ted

Answer by Starx

appending an <object> dynamically in IE doesn't work

Question by CCrawler

Answer by Starx

Demo

Doesn't Internet explorer support $.ajax method?

Question by user1089964

Answer by Starx

Yes, it DOES work

jQuery UI Background Color Flickers in IE

Question by Aaron

Answer by Starx

Jquery and old IE versions

Question by GuyFromOverThere

Answer by WTK

Answer by Starx

Pure CSS Rounded Corners in IE6-8 (JQuery Accepted)

Question by BHare

Answer by Erik

Answer by Starx

Please fill the form - I will response as fast as I can!