Fix javascript to work properly in jquery-driven form

GessWurker
GessWurker used Ask the Experts™
on
Script for copying field values doesn't work in jquery-heavy site. How do I modify this to restore functionality? The script used to work fine, but when the application was upgraded and started using lots of jquery vs. the old stuff, the script stopped working. Is it merely a question of adding $(document.ready() { ...   to the right place?

<script language = "JavaScript">
               function copyToBusiness()
               {
       var f=document.forms["aspnetForm"];
       f.elements["ctl00$ctl00$mpcSingleContent$cntrlID_11155"].value = f.elements["ctl00$ctl00$mpcSingleContent$cntrlID_11148"].value;
        f.elements["ctl00$ctl00$mpcSingleContent$cntrlID_11154"].value = f.elements["ctl00$ctl00$mpcSingleContent$cntrlID_11147"].value;
               }
</script>

<a href="javascript:copyToBusiness()">Click to copy the Business Address below</a>
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Hi,

using Chrome right click / inspect and check if you have error in the console
(let it open during your tests)
this will tell you where the problem is.

Author

Commented:
Oh... I see the error, but I haven't found it especially helpful.   : )

Edit.aspx?rID=MTA4&c…ckToL=VHJ1ZQ==:1596 Uncaught TypeError: Cannot read property 'value' of undefined
    at copyToBusiness (Edit.aspx?rID=MTA4&c…ckToL=VHJ1ZQ==:1596)
    at <anonymous>:1:1
copyToBusiness      @      Edit.aspx?rID=MTA4&c…ckToL=VHJ1ZQ==:1596
(anonymous)      @      VM3452:1

This makes me think value just isn't available yet and that I need document.ready()
yes or not defined ...
Ensure you’re charging the right price for your IT

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden using our free interactive tool and use it to determine the right price for your IT services. Start calculating Now!

Author

Commented:
Ahem...

Fixed it. See the "$(document).ready(function()" solution tacked on to the end of the script below:  

<script language = "JavaScript">
    function copyToBusiness()
       {
         var f=document.forms["aspnetForm"];
         f.elements["ctl00$ctl00$mpcSingleContent$cntrlID_11155"].value = f.elements["ctl00$ctl00$mpcSingleContent$cntrlID_11148"].value;
        }
        $(document).ready(function () {
        $('#copyBus').attr("href", "javascript:{ copyToBusiness() }");
        });
</script>
<a href="javascript:void()" id="copyBus">Click to copy the Business Address below</a>
See the "$(document).ready(function()" solution tacked on to the end of the script below:  

<script language = "JavaScript">
    function copyToBusiness()
       {
         var f=document.forms["aspnetForm"];
         f.elements["ctl00$ctl00$mpcSingleContent$cntrlID_11155"].value = f.elements["ctl00$ctl00$mpcSingleContent$cntrlID_11148"].value;
        }
        $(document).ready(function () {
        $('#copyBus').attr("href", "javascript:{ copyToBusiness() }");
        });
</script>
<a href="javascript:void()" id="copyBus">Click to copy the Business Address below</a>

Author

Commented:
Actually... by the time this ended, I scrapped the standard javascript and went with the following to copy multiple form field values:

<script type="text/javascript">
$('#copyBus').click(function(){
    $('#cntrlID_11155').val($('#cntrlID_11148').val());  
    $('#cntrlID_11154').val($('#cntrlID_11147').val());  
    $('#cntrlID_11156').val($('#cntrlID_11149').val());  
    $('#cntrlID_11157').val($('#cntrlID_11150').val());  
    $('#cntrlID_11158').val($('#cntrlID_11151').val());  
    $('#cntrlID_11159').val($('#cntrlID_11152').val());  
});
</script>

<a href="javascript:void(0);" onclick="void(0);" id="copyBus">Click to copy the Business Address below</a>

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial