1

I have used Jquery to append options to Infopath created select dropdown. It works in Firefox but it does not populate in IE. Below is the code used:

var newOption = $('<option value="'+val+'">'+val+'</option>');
$('select[originalid="V1_I1_D6"]').eq(0).append(newOption);

Any help is appreciated!

Improve this question
13
  • Look at the html in IE and see if originalid is different that it is in firefox
    – Roland
    Commented Sep 2, 2016 at 1:13
  • No both are same
    – Keerthi
    Commented Sep 2, 2016 at 1:14
  • just hit this $('select[originalid="V1_I1_D6"]') in console tab in developer tool in IE. What does it return? Is it returning the dropdown control?
    – Ankit Kumar
    Commented Sep 2, 2016 at 6:12
  • yes it is. returning the control
    – Keerthi
    Commented Sep 2, 2016 at 12:13
  • 1
    It should work if its responding in developer tool. check if all files like sp.js and init.js are loaded. I guess you need to call that specifically in your script like jQuery(document).ready(function () { SP.SOD.executeFunc('sp.js', 'SP.ClientContext', yourfunction); });
    – Ankit Kumar
    Commented Sep 2, 2016 at 13:57

4 Answers 4

Reset to default
2

Below snippet is working fine for IE8 and later version.

$("#ddlDomain option").eq(0).before($("<option></option>").val("").text("--Select--"));

If you want to show selected option which you have added by above statement then you need to add one more statement as below:

$('#ddlDomain').prop('selectedIndex', 0);

Hope this helps you...

Happy Coading :) :) :)

Improve this answer
0

If you already tried to put your JavaScript code inside window.onload or $(document).ready(...) events without success, then you could try to call your function in this way:

<script type="text/javascript">
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(retrieveListItems);
</script>
Improve this answer
0

What you're likely facing is that the element that you're attempting to select via jQuery here is being written into the DOM by some other script that's running on the page as your code is working just fine from the console but not in ready()

In all honesty the easiest solution is likely a dirty hack to delay your script for a short period of time. Give this a whirl:

$().ready(function(){
  function insertNewElement() {
    var newOption = $('<option value="'+val+'">'+val+'</option>');
    $('select[originalid="V1_I1_D6"]').eq(0).append(newOption);
  }
  window.setTimeout(insertNewElement, 1000);
});

All it's doing is waiting 1000ms to execute your code. You may need to fiddle with the timing and it's not going to be 100% reliable. For example if your user has a horrible internet connection and the way that the form you want to manipulate is loading data after ready() fires and it takes longer than 1000ms to return it's going to fail. That said for many environments this is going to be good enough.

Improve this answer
2
  • Even I thought the same. I delayed the script for like 2 secs. It works fine sometimes but mostly it doesn't populate.
    – Keerthi
    Commented Sep 8, 2016 at 16:17
  • So it works sometimes at 2s but never if you don't delay? Sounds like this is on the right track. bump it up some more are re-try?
    – GavinB
    Commented Sep 8, 2016 at 16:31
0

I know that in older versions of IE there were all kinds of issue modifying a select's options. This technique has worked for me instead of creating new Options and appending those

$('#selector')
   .append($('<option></option>')
   .attr("value",item.value)
   .text(item.Title)
Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.