ajax issue with error error 80020101 when returning a string from request

Question

I get the following error from my code execution: Microsoft JScript runtime error: Could not complete the operation due to error 80020101.

The following link is what is something i found on Stackoverflow: Ajax request problem: error 80020101

var div = $("<div class='modal'>").html($(result.getWebFormDesignFieldContentsResult));

The passed in information, result.getWebFormDesignFieldContentsResult is a long string of HTML and JAVASCRIPT which is not parsed into DOM yet. I just find it weird as I had it working the other day, and then was trying to add additional functionality.... breaking it. :(

The string passed in is rather large, but is something to the likes of:

<div>input tags for filtering</div>
<select><option></option>...[150 option tags]... </select>
<anchor tag to return contents>
<script type = "text/javascript">
  ...stuff fires related to the above items...
</script>

I was thinking it was having an issue taking the information passed as a string being put into the div tag as it MIGHT not like the script tags.

Has anyone else accomplished this, or what to give me some pointers as to how to handle this? I might want to make a string object, and then break the contents up accordingly and only put html in html, and then handle the js in a different style.

The Result String (result.getWebFormDesignFieldContentsResult)

You can also visit here: http://jsfiddle.net/3kFv2/

            <table style='width:inherit;'>
                <tr>
                    <td>
                        <input type='text' id ='queryInput' onkeypress = 'clearTimeout(timerVar); timerVar = setTimeout(function(){ fetchFieldInfo($("#queryInput").val()); },1000);' />
                    </td>
                    <td style = 'text-align:right;'>
                        <a class = 'modalButton' id = 'queryButton' runat='server' value = 'Re-Filter' onCLick = '$("div.modal").fadeOut(); fetchFieldInfo($("#queryInput").val());'>Re-Filter</a>
                    </td>
                </tr>
                <tr>
                    <td colspan='2' style='margin-left:auto; margin-right:auto; text-align:center;'><select size = '20' id = 'selectList' name = 'selectList' ><option value = '1000'>Abutment Notes</option><option value = '2300'>Abutments Notes</option><option value = '2302'>Abutments Notes Maint Need</option><option value = '2301'>Abutments Notes Remarks</option><option value = '10942'>Concrete Deterioration Maint Need</option></select></td>
                <td>
                    <div style='width:300px;height:300px;' id = 'modalInfoPanel'>
                    </div>
                </td>
            </tr>
            <tr>
                <td></td>
                <td style='text-align:right;'>
                    <a class = 'modalButton' id = 'buttonReturnValue' value = 'Return Selected Element' onClick='$("div.modal, div.overlay").fadeOut();'>Return Selected Element</a>
                </td>
            </tr>
        </table>
        <script type = 'text/javascript'>
            function ajaxDisplayContents(value){
                //alert(value.val());
 /*
                $('#selectList option').each(function(){
                    return $(this).val() == '';
                }).attr('selected','selected');
 */
                $.ajax({
                    type: 'POST',
                    url: WEBSERVICE_URL + '/fetchFieldInfo',
                    dataType: 'json',
                    contentType: 'application/json',
                    data: JSON.stringify({'fe_id': value.val().toString()}),
                    success: function(result, textStatus, jqXHR){
                        $('#modalInfoPanel').html(result.fetchFieldInfoResult);
                    },
                    error: function(xhr, status, message){
                        $('#modalInfoPanel').html(status + ' ' + message);
                    }
                });
            }
            $('select#selectList').change(function(){
                ajaxDisplayContents($(this));
            });


            $(function(){
                $('ul li').click(function(){ clicker(this); });
            });
            function clicker(x){
                if($(x).next().is('li') || $(x).next().length == 0){
                    $.ajax({
                        type: 'POST',
                        url:,
                        dataType: 'json',
                        contentType: 'application/json',
                        data: JSON.stringify({}),
                        success: function(result){
                            $(x).after($('<ul>').append($(result['METHODResult']));
                            $(x).next().find('li').click(function() clicker(this); });
                        },
                        error: function(){
                            alert('failed to fetch');
                        }
                    });
                }else if($(x).next().is('ul')){
                    $(x).next().slideUp(function(){ $(this).remove(); });
                }
            }
        </script>

If you have a string of HTML you can pass it directly to the `.html()` function, you don't have to wrap it in a jQuery object first. — Anthony Grist, Jul 17 '12 at 14:40
Yea, i know. I put it in there both ways, my original way was exactly as you have said it. I was just checking to see if there were an issue with it. — Fallenreaper, Jul 17 '12 at 14:41
Can we see more of the code? Seeing how you're doing the AJAX call, etc would be useful. Also include the full ` — Anthony Grist, Jul 17 '12 at 14:46
I put all the string into the HTML and didnt split it up because thats what jquery was going to do, with jquery's .html() function — Fallenreaper, Jul 17 '12 at 14:56
Right at the end of the code you added: `else if($(x).next().is(;ul')){` - is that typo with the `;` rather than `'` in the actual code? — Anthony Grist, Jul 17 '12 at 14:58
Resolving that issue and another JS issue have NOT fixed the error in question. It is still erroring — Fallenreaper, Jul 17 '12 at 16:23
`"text/javasript>` is it another typo here ..closing with `"` — Suave Nti, Jul 17 '12 at 16:38
I found the issue, and commented it out and it works. I just need to figure out how to fix it. The error is occuring from the contents of the function "clicker()" — Fallenreaper, Jul 17 '12 at 16:38
I love the flaws of creating javascript solely inside string tags, so i cannot recognize syntax coloring. — Fallenreaper, Jul 17 '12 at 16:40
@user1042031 where is that at? I was looking at my code, and did not see that. That wasnt offocial code anyways, it was pseudo. — Fallenreaper, Jul 17 '12 at 16:43
Another possible reason that generates the same error: http://bugs.jquery.com/ticket/9221 — Dzhuneyt, Jun 26 '14 at 12:56

score 4 · Answer 1 · edited Nov 30 '12 at 14:07

4

I got the same error 80020101.

Then while checking the code line by line, I realized I added this twice by mistake: <script<script>

Once I removed these, the error went away.

So double check all of your code, especially for opening tags that aren't closed properly.

edited Nov 30 '12 at 14:07

joulesm

642
1
6
28

answered Nov 30 '12 at 13:28

ganesh

41
2

You seem to have forgotten a word or two there... "by mistake i added (twice,which is unwanted)..." What did you add? – Alejo Nov 30 '12 at 13:51

score 3 · Accepted Answer · answered Jul 17 '12 at 17:02

Looking at: http://mattwhite.me/blog/2010/4/21/tracking-down-error-80020101-in-internet-exploder.html tells you that while there are errors such as embedded script tags, etc.... at the root, the error is simply stating "There is an Error".

After taking that information to heart, I delved down into my code to find more and more issues by commenting out pieces here and there. The error i found in question was the clicker() ajax call. I looked at it for a second and realized that the original ajax call was commented out. This is a new call to a webservice not implemented and has errors. Since i commented it out, it works like normal again, i just have to define everything correctly for that ajax call and all will be good.

I thank all of you for helping with the debug. :)

score 0 · Answer 3 · answered Apr 22 '15 at 07:44

In my case the problem were special characters (accents) that were located at the end of some comment lines.

When these characters are close to the end of the comment line, Internet Explorer deletes some of them (including the newline character) and breaks the JavaScript code.

// This comment line could fail because it has an accent at the end aeíou
alert("This line probably doesn't work in IE");

IE will understand this line as:

// This comment line could fail because it has an accent at the end **aealert**("This line probably doesn't work in IE");

I hope it help you.

ajax issue with error error 80020101 when returning a string from request

3 Answers3