jquery: how to open an url in new tab with passing post data to that url

Question

I have a php file localhost/~user/sample.php file which gets data from post method.

<?php
$you = $_POST["ids"];
$start= $_POST["start"];
echo $you."--".$start;

I want to write a jquery code which will open the url "localhost/~user/sample.php" in a separate window on button click inside my html page and also pass the arguments required for it.

I can use get method in php, but the number of variables are more

assume i have 20 variables like name1, name2 etc how to pass them — Santhosh, Feb 14 '16 at 08:58

score 5 · Answer 1 · edited May 23 '17 at 11:45

5

I would probably go for using a form, like so:

<form action="sample.php" method="post" target="_blank">
  <input type="hidden" name="name1" />
  <input type="hidden" name="name2" />
  ...
  <input type="hidden" name="name20" />
  <input type="submit" value="Go to page">
</form>

This is the most cross-browser JS-failsafe basic html version way of achieving this task that I can think of...

If you need to dynamically add form fields to the form, I believe you will find this question: Jquery - Create hidden form element on the fly handy. Copying the modified answer:

$('<input type="hidden" name="myfieldname" value="myvalue">').appendTo('form');

edited May 23 '17 at 11:45

Community

1
1

answered Feb 14 '16 at 09:02

Noy

1,258
2
11
28

but i dont want to use any form. I just want to collect some data and send – Santhosh Feb 14 '16 at 09:07
How do you mean? The user doesn't see the form. You're just using it to send the variables.. – Noy Feb 14 '16 at 09:10
@SanthoshYedidi: All input fields in her form are **hidden** - besides the submit button (which could also be made invisible). – hherger Feb 14 '16 at 09:12
Ok. the number of data i have to send keep varying.Also How to append this in the body. – Santhosh Feb 14 '16 at 09:16
Does the data vary on the clients' side or on server side? – Noy Feb 14 '16 at 09:17

Wesley Smith · Answer 2 · 2016-02-14T09:22:56.023

One way would be to dynamically create a hidden form and then submit it, make sure you encode the input:

var params = [['someKey0', 'someValue0'], ['someKey1', 'someValue1'], ['someKey2', 'someValue2'], ['someKey3', 'someValue3']];

var inputs = $.map(params,function(e,i){
  return '<input type="hidden" name="'+e[0]+'" value="'+encodeURIComponent(e[1])+'"/>';
});
var form ='<form action="sample.php" id="hidden-form" method="post" target="_blank">'+inputs.join('')+'</form>';

$('#hidden-div').html(form);
$('#hidden-form').submit();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="hidden-div"></div>

score 0 · Answer 3 · answered Nov 15 '17 at 17:55

Try this....

<form id="myForm" action="sample.php" method="post">
<?php
     echo '<input type="hidden" name="'.htmlentities($you).'" value="'.htmlentities($start).'">';
?>
</form>
<script type="text/javascript">
    document.getElementById('myForm').submit();
</script>

score -1 · Answer 4 · answered Feb 14 '16 at 09:14

if you send request with javascript to any php page; it sends a request and gets the respose to the page which has sent request and you continue process your data at your first page. So if you want to open your sample.php and also send your post data within; you must send your data with something like php form.

Submitting forms: http://www.w3schools.com/php/php_forms.asp

If you want to use js post, you can do something like below:

teams.php:

data = { teams : ['Real Madrid','Barcelona','etc']};
var response = null;
$.ajax({
    url : 'mypostfile.php',
    type : 'POST',
    data : data
})
.done(function(resp){ response = resp; //it returned from php echo  })
.fail(function(){   console.log('fail'); //post process failed. });

mypostfile.php:

if(isset($_POST['teams'])){
   $teams = $_POST['teams'];
   echo $teams[0]; //response : Real Madrid
}

Hope it helps.

You should submit php form if you want to open your second page. — Mehmet Cetin, Feb 14 '16 at 09:28
Op stated *I want to write a jquery code which will open the url "localhost/~user/sample.php" in a separate window* — Wesley Smith, Feb 14 '16 at 09:31

jquery: how to open an url in new tab with passing post data to that url

4 Answers4