Angie
Angie

Reputation: 125

Passing multiple variables to Javascript Function

I am able to pass one variable (ID) to the javascript function, however when I go to add the businessname variable, the popupdiv does not display.

Button to displaydiv and pass ID (this works)

<input type='button' id='report-submit' value='Go' onclick='displayDiv(".$id.")'>

Javascript (works)

function displayDiv(divid) {
    e=document.getElementById("zbadmin-"+divid);
    strUser=e.options[e.selectedIndex].value;
    if (strUser=='2') {
        document.getElementById('def').style.display = "block";
        document.getElementById('link-id').href="delete?id="+divid;
    }

}

But when I add businessname, doesnt work

<input type='button' id='report-submit' value='Go' onclick='displayDiv(".$id.",'".$businessname."')'>

Javascript (doesnt work)

function displayDiv(divid,divbizname) {
    e=document.getElementById("zbadmin-"+divid);
    strUser=e.options[e.selectedIndex].value;
    if (strUser=='2') {
        document.getElementById('def').style.display = "block";
        document.getElementById('link-id').href="delete?id="+divid+"&businessname="+divbizname;
    }

}

Am I missing something very simple? I replaced it with plain text and it didnt work either.


EDIT: Heres the code prior to the button. It grabs data from SQL table and produces a dropdown. As a test, ive put $id as both variables in the below code, it works fine and displays the popup.

while($row = mysql_fetch_array($proposal_result)) {
        $date=substr($row["date"], 0, 50);
        $formatted_date=date('d/m/Y', strtotime($date));
        $id=substr($row["idproposal"], 0, 50);
        $businessname=substr($row["businessname"], 0, 50);
        $status=substr($row["status"], 0, 50);
        $staff=substr($row["staff"], 0, 50);
        $file_access='<storage-bucket>';
        $file_name='proposal_'.$id.'_'.$businessname.'.pdf';
        $file=$file_access.$file_name;
        print "<tr><td>".$formatted_date."</<td><td>".$id."</td><td width='25px'><a href='".$file."'target='_blank'><img src='".$images."/attachment.png' alt='file'></a></td><td>".$businessname."</td><td>".$staff."</td><td>".$status."</td><td>
            <div>
                <select id='zbadmin-".$id."' name='zbadmin-".$id."' class='dropdowns'  required>
                    <option value='0'>Select and action...*</option>
                    <option value='1'>Change Status for ID#".$id."</option>
                    <option value='2'>Delete Proposal</option>
                </select>
           <input type='button' id='report-submit' value='Go' onclick='displayDiv(".$id.",".$id.")'></div>

If I use the $id, $date it works fine as its grabbing numbers, but as soon as I replace the second variable with one thats a string, it doesnt display the popupdiv below:

<div id='def'>
                    <div id='popup'>
                        <form name='deletefeedback' action='' method='post'>
                            <!--<img id='close' src='images/3.png'> CLOSE ICON-->
                            <h2>Reason for deleting proposal <script>function getID() { alert($divid);window.location='?divid='+$divid';}</script></h2>
                            <hr>
                            <input id='deletereason' type='radio' name='deletereason' class='radio' value='Added by mistake'>Added by mistake<br />
                            <input id='deletereason' type='radio' name='deletereason' class='radio' value='Added by mistake'>No longer required<br />
                            <input id='deletereason' type='radio' name='deletereason' class='radio' value='Added by mistake'>Incorrect Information Provided<br />
                            <input id='deletereason' type='radio' name='deletereason' class='radio' value='Added by mistake'>Reason 4<br />
                            <textarea name='deletecomments' placeholder='Comments...'></textarea><br />
                            <a href='' id='link-id'><input type='button' id='report-submit' value='Delete Proposal'></a><a href='/zerobooks-admin-dashboard'><input type='button' id='report-submit' value='Cancel'></a>
                        </form>
                    </div>
                </div>

Upvotes: 3

Views: 6628

Answers (3)

Paul Muriithi
Paul Muriithi

Reputation: 41

Use

    <input type='button' id='report-submit' value='Go' onClick="displayDiv('<?php echo $id ?>', '<?php echo $businessname ?>');">

Example

<?php 
$id = '1'; 
$businessname = 'Business Name'; 
?> 
<html> 
    <head> 
    <script type="text/javascript"> 
    function displayDiv(id, businessname) { 
       alert(id);
       alert(businessname);
    } 
    </script> 
</head> 
    <body> 
        <input type='button' id='report-submit' value='Go' onClick="displayDiv('<?php echo $id ?>', '<?php echo $businessname ?>');">
    </body> 
</html>

Upvotes: 0

Angie
Angie

Reputation: 125

Got it working. Found the answer at passing a parameter with onclick function is read as a variable when it should be read as a string

Essentially, I just added backslashes to pass parameter as string

 <input type='button' id='report-submit' value='Go' onclick='displayDiv(".$id.",\"".$businessname."\")'>

Upvotes: 1

tymeJV
tymeJV

Reputation: 104785

You're adding a weird mix of single quotes before the second argument, get rid of those:

onclick='displayDiv(".$id.", ".$businessname.")'

Upvotes: 2

Related Questions