简体   繁体   中英

Passing values from multiple input fields to popup using javascript/jquery

I am trying to pass multiple input fields to a popup page. Here's what I have done:

<tr>
<th>Item Category</th>
    <td><input type="text" name="object_category" disabled="disabled" id="pid1" />
    </td>
<tr>
<th>Item Name</th>
    <td><input type="text" name="object_name" disabled="disabled" id="pid2" />
    <input type="button" id="item_name" name="choice" onClick="selectValue2('id2')" value="?"></td>
</tr>

The value of is filled up by returning its value from a different page.

Now I want to pass the values of id: pid1 and id: pid2 to a new popup page using javascript. Here's my selectValue2() function definition:

function selectValue2(pid2){
    // open popup window and pass field id
  var category = getElementById('pid1');
    window.open("search_item.php?id=pid2&&cat="+category+""",'popuppage',
  'width=600,toolbar=1,resizable=0,scrollbars=yes,height=400,top=100,left=100');
}

But, selectValue2 is not working, as popup is not opening. How to pass the values of these two fields to my new popup?

Here you have the problem:

var category = getElementById('pid1');

You need to replace it by :

var category = document.getElementById('pid1');

As getElementById works with document object.

You need to use

document.getElementById

Further, you will need to use value, because getElementById is grabbing the entire element

Your code would look something like:

function selectValue2(pid2){
    // open popup window and pass field id
  var category = document.getElementById('pid1').value;
    window.open("search_item.php?id=pid2&&cat=" + category + """,'popuppage',
  'width=600,toolbar=1,resizable=0,scrollbars=yes,height=400,top=100,left=100');
}

You can do something similar for the 2nd pid value - not sure why you are passing it to the function.

try this

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function selectValue2(){
    // open popup window and pass field id
  var category = document.getElementById('pid1').value;
  var pid = document.getElementById('pid2').value;
    window.open("test.php?id="+pid+"&cat="+category+"",'popuppage',
  'width=600,toolbar=1,resizable=0,scrollbars=yes,height=400,top=100,left=100');
}
</script>
</head>

<body>
<tr>
<th>Item Category</th>
    <td><input type="text" name="object_category" id="pid1" />
    </td>
<tr>
<th>Item Name</th>
    <td><input type="text" name="object_name"  id="pid2" />
    <input type="button" id="item_name" name="choice" onClick="selectValue2()" value="?"></td>
</tr>
</body>
</html>

for Jquery,

var pid1Val = $("#pid1").val();
var pid2Val = $("#pid2").val()

for Javascript,

var pid1Val = document.getElementById('pid1');
var pid2Val = document.getElementById('pid2');

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM