0

I am creating a debugger utility to help me out in debugging without the to follow cumbersome process of redeploying and going to all the way to the page to test it. so I have created the below functions which are called by various buttons.

     function updateTestCode()
    {
        $("script[for='testing']").html('');
        alert('Adding function ' + $('#_testArea').val());
        $("script[for='testing']").append($('#_testArea').val());



    }

function checkCode()
{
    alert('Calling Function ');
    try{
        validateFields();
    }catch(err)
    {
        form.showDebugMsg("Error When Running Script " + err);
    }
}

function generateScriptCode()
{
    $('#_testArea').val($("script[for='testing']").html());
}

Now all I wanted to do is to allow me to update the value of the function below and use it without the need for redeployment.

<script type="text/javascript" for='testing'>
function validateFields()
{
    alert('Hello World');

}</script>

Now the problem is that Firefox is able to update the code (IE throws error) and retrieve it. But when I try to click and execute the script it still show result of the old function.

Any Ideas what I might be doing wrong???

Rox
  • 33
  • 1
  • 5

1 Answers1

0

This is happening because you're using the same script tag and changing the inner text. You have to add a new script tag.

scriptContent = "... function ...";

// delete old tag
$("#testScript").remove();

// add a new one
$("<script id='testScript'/>").text(scriptContent).appendTo("head");

Also, you cannot use append() to add text to an element like you're doing on your updateTestCode() function. You have to use the text().

// use text(), not append()
$("script[for='testing']").text($('#_testArea').val());

Here an working example: http://jsfiddle.net/MtY3h/

Marcelo De Zen
  • 9,439
  • 3
  • 37
  • 50
  • I tried what you had added to jfiddle, if I update the script tag I wanted the updated script to run. I update your jFiddle code as below `$("[data-which]").click(function(){` `var n = $(this).attr("data-which");` `var scriptContent = 'function testMe(){alert(\'Hello World\')}';` `// delete old tag` `$("#testScript").remove();` `// add a new one` `$("").text(scriptContent).appendTo("head");` `// call function` `sayHello();` `testMe();` `});` – Rox Aug 04 '12 at 17:16
  • Here is the link to fiddle I had created --> [jsFiddle](http://jsfiddle.net/xajat007/cZWHp/) – Rox Aug 04 '12 at 17:22
  • @Rox, by the way my fiddle in answer run the updated script in case you haven't notice. – Marcelo De Zen Aug 04 '12 at 17:35