I am trying to fire a javascript by onclick event of submit button but not able to, Details of my code are "i have a button named filter and two text boxes which take the Id and Name, All i want is "When i enter the value in Id textbox and click Filter then i want the values to be displayed on URL using QueryString". here's the code..

    print "<td><b>UserId</b></td><td><input type=\"text\" name=\"User_Id\" 
        value=\"" .$Id."\"  size=\"6\" ></td>";
    print "<td><b>UserName</b></td><td><input type=\"text\" name=\"User_Name\"
      value=\"" .$Name  ."\" size=\"10\"></td>";
    print "<td><input type=\"submit\" name=\"Filter\" value=\"Filter\" 
              onClick=\"FilterExpression($Id,$Name)\"></td>"; 

After i click Filter this code gets executed..

          if ( $q->param("Filter") )
               { 
                $Id=$q->param('User_Id');
                $Name=$q->param('User_Name');
          if ($Id ne "" )
                {
            $filterexpression= $filterexpression." UserId like '" .$Id. "%' and " ;
                }
          if ($Name ne "" )
                {
           $filterexpression= $filterexpression." UserName like '" .$Name. "%' and " ;
                }
             } 

The Javascript..

    <script type="text/javascript">
function FilterExpression(Id,Name)
         {
          var val3=Id;
          var val4=Name
           window.location="List.cgi?Id="+val3+"&Name="+val4
           }
     </script>

Please Do help me out find the solution,Thank you.

I am trying to fire a javascript by onclick event of submit button but not able to, Details of my code are "i have a button named filter and two text boxes which take the Id and Name, All i want is "When i enter the value in Id textbox and click Filter then i want the values to be displayed on URL using QueryString". here's the code..

    print "<td><b>UserId</b></td><td><input type=\"text\" name=\"User_Id\" 
        value=\"" .$Id."\"  size=\"6\" ></td>";
    print "<td><b>UserName</b></td><td><input type=\"text\" name=\"User_Name\"
      value=\"" .$Name  ."\" size=\"10\"></td>";
    print "<td><input type=\"submit\" name=\"Filter\" value=\"Filter\" 
              onClick=\"FilterExpression($Id,$Name)\"></td>"; 

After i click Filter this code gets executed..

          if ( $q->param("Filter") )
               { 
                $Id=$q->param('User_Id');
                $Name=$q->param('User_Name');
          if ($Id ne "" )
                {
            $filterexpression= $filterexpression." UserId like '" .$Id. "%' and " ;
                }
          if ($Name ne "" )
                {
           $filterexpression= $filterexpression." UserName like '" .$Name. "%' and " ;
                }
             } 

The Javascript..

    <script type="text/javascript">
function FilterExpression(Id,Name)
         {
          var val3=Id;
          var val4=Name
           window.location="List.cgi?Id="+val3+"&Name="+val4
           }
     </script>

Please Do help me out find the solution,Thank you.

• javascript
• perl

• 1 You should include more details, like the values of $Id and $Name, as well as the actual HTML generated by your code. Also, what happens when you click on the button? – cjm Commented Oct 11, 2010 at 6:01
• can you check it, whether $Id and $Name are replacing with their values at onClick=\"FilterExpression($Id,$Name)\" or not? – Nikhil Jain Commented Oct 11, 2010 at 6:06
• 2 Please include the HTML output for the function caller. In other words, in your browser, view source and copy the html generated by print "<td><input type=\"submit\" name=\"Filter\" value=\"Filter\" onClick=\"FilterExpression('$Id','$Name')\"></td>";. – gilly3 Commented Oct 11, 2010 at 6:50
• i viewed the source after entering the value of Id as 1,its taking the value properly.Here it is : <td><input type="submit" name="Filter" value="Filter" onClick="FilterExpression('1','')"></td>. But i am not finding any reason for not displaying it in the URL query string.;-( – SUSH Commented Oct 11, 2010 at 7:10

3 Answers 3

1. If you use <form> you can use method="get" is easy way.
2. If you dont want to use <form> please add "id" into

<input type=\"text\" id='User_Id' name=\"User_Id\" value=\"" .$Id."\" size=\"6\" >

and write Javascript like this.

function FilterExpression()
{
var val3=document.getElementById("User_Id").value;
var val4=document.getElementById("User_Name").value;
window.location="List.cgi?Id="+val3+"&Name="+val4
}

Looks like you may need quotes. Try onClick=\"FilterExpression('$Id','$Name')\"

Your problem es from trying to do plicated and hard to manage quotes and escapes.

If you ever have to escape quotes in a Perl program, chances are, you are doing it wrong.

Perl has many different ways to quote strings that make it easy to manage strings, and fill-in variable values. The powerful quoting operators make escaping quote characters an extreme rarity.

I'll show you a few examples.

Your example could be handled with an interpolating here-doc:

my $filter_expression = FilterExpression($Id,$Name);

print <<"END_HTML";
<td><b>UserId</b></td><td><input type="text" name="User_Id" value="$Id"  size=\"6\" ></td>"
<td><b>UserName</b></td><td><input type="text" name="User_Name" value="$Name" size="10"></td>
<td><input type="submit" name="Filter" value="Filter" onClick="$filter_expression"></td>
END_HTML

Or you could use the qq operator to quote assemble your output:

print qq{<td><b>UserId</b></td><td><input type="text" name="User_Id" value="$Id"  size="6" ></td>};

print qq[<td><b>UserName</b></td><td><input type="text" name="User_Name" value="$Name" size="10"></td>];

print qq(<td><input type="submit" name="Filter" value="Filter" onClick=."$filter_expression"></td>); 

Or if you insist on avoiding interpolation, simply use a single quote:

print '<td><b>UserId</b></td><td><input type="text" name="User_Id" value="'
      .$Id
      .'"  size=\"6\" ></td>';

print '<td><b>UserName</b></td><td><input type="text" name="User_Name" value="'
      .$Name
      .'" size=\"10\"></td>';

print '<td><input type="submit" name="Filter" value="Filter"  onClick="'
      .FilterExpression($Id,$Name)
      .'"></td>';

Also, seriously consider using a template system to handle your HTML generation.