Отправить post запрос html

237
15 июля 2018, 05:10

Отправить запрос методом POST на сторонний сайт, как это сделать правильно, в форме будет 2-3 поля для заполнения, нужно написать скрипт отправления поля именуются:

  • fio
  • phone
  • additional11

var num_params = document.getElementById('nums').value  //кол-во строчек для параметров запроса 
	var formZ = document.getElementById('post_me');  //отправляемая форма 
	formZ.action = document.getElementById('url').value;  //форма для url адреса 
	var meth = document.forms[0].method; 
	formZ.method = meth.options[meth.selectedIndex].value;  //проверяем какой метод выбран post или get 
	var enctype = document.forms[0].enctype; 
	formZ.enctype = enctype.options[enctype.selectedIndex].value;  //проверяем какой выбран метод кодирования формы 
 
	for (i=1; i<=num_params; i++) {  //если введено имя запроса, назначаем его форме со значением запроса 
		var namez=document.getElementById('nam_' + i);  
		var valz=document.getElementById('val_' + i); 
		if(namez.value!=''){ 
			valz.name=namez.value; 
		}else{ 
			break; 
		} 
    } 
	formZ.submit(); 
	if(document.forms[0].interval.value > 0){ 
		interval=setInterval(function(){formZ.submit()}, document.forms[0].interval.value * 1000); 
	} 
} 
 
function set_target(sel){ 
	var target=sel.options[sel.selectedIndex].value; 
	target=(target=='frame') ? Math.random() : target; 
	document.getElementById('post_me').target=target; 
} 
 
function NewRow(ob) {//для добавления новых строк параметров запроса 
	var num = ob.id; 
	var num  = num.substr(num.lastIndexOf("_")+1); 
	num++; 
        var nums=document.alternate.nums.value; 
	if(nums==num) 
	{ 
		num++; 
		var tbl = document.getElementById("t"); 
		var cnt = tbl.rows.length; 
		var oRow = tbl.insertRow(cnt); 
		var oCell = oRow.insertCell(0); 
		oCell.innerHTML = '\n<input type="text" id="nam_'+num+'" value="" size="30">\n'; 
		var oCell = oRow.insertCell(1); 
		oCell.innerHTML = '\n<input type="text" id="val_'+num+'" onChange="NewRow(this)" value="" size="50">\n'; 
		document.alternate.nums.value = num; 
	} 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div> 
	<form hidden name="alternate"> 
   
		<input hidden type="text" id="url" value="ссылка API"> <!-- задаем свою ссылку куда отправлять запрос --> 
		<select name="method"> 
			<option value="POST">POST</option> 
		</select> 
     
        <select hidden name="enctype"> 
          <option value="application/x-www-form-urlencoded">application/x-www-form-urlencoded</option> 
        </select> 
         
		<select hidden onchange="set_target(this)"> 
			<option value="_self">В этом окне</option> 
		</select> 
		<input hidden value="-1" id="interval" name="interval">  
 
		<input type="hidden" id="nums" value="3"> 
	</form> 
</div> 
 
<div style="float: left;"> 
	<form id="post_me" name="post_me" target="_blank"> 
		 
				<input type="text" name="fio" id="fio" value=""> 
				<input type="text" name="phone" id="phone" value=""> 
                <input type="text" name="additional11" id="additional11" value=""> 
			 
			 
		<input type="button" onclick="sendit()" value="Оформить заказ"> 
		 
	</form> 
</div>

var valz=document.getElementById('val_' + i);
if(namez.value!=''){
valz.name=namez.value;
}else{
break;
}
}
formZ.submit();
if(document.forms[0].interval.value > 0){
    interval=setInterval(function(){formZ.submit()}, 
document.forms[0].interval.value * 1000);
}
}
function set_target(sel){
var target=sel.options[sel.selectedIndex].value;
target=(target=='frame') ? Math.random() : target;
document.getElementById('post_me').target=target;
}
function NewRow(ob) { //для добавления новых строк параметров запроса
var num = ob.id;
var num  = num.substr(num.lastIndexOf("_")+1);
num++;
    var nums=document.alternate.nums.value;
if(nums==num)
{
num++;
var tbl = document.getElementById("t");
var cnt = tbl.rows.length;
var oRow = tbl.insertRow(cnt);
var oCell = oRow.insertCell(0);
oCell.innerHTML = '\n<input type="text" id="nam_'+num+'" value="" 
size="30">\n';
var oCell = oRow.insertCell(1);
oCell.innerHTML = '\n<input type="text" id="val_'+num+'" 
onChange="NewRow(this)" value="" size="50">\n';
document.alternate.nums.value = num;
}
}
Answer 1

Вот вам простой пример отправки данных с формы на сторонний сайт методом POST:

$(document).on('submit', '#example_form', function(e) { 
  e.preventDefault(); // запретим стандартное поведения отправки данных 
  var data = $(this).serializeArray(); // получаем данные с формы 
 
  $.ajax({ 
    url: 'http://new-site.ru/example_script', // адрес скрипта который примит данные 
    type: 'POST', // метод передачи 
    dataType: 'JSON', // !если требуется! получить ответ как массив данных используем формат JSON 
    data: data // передаем массив данных 
  }).done(function(res) { 
    alert('Данные успешно переданы!'); 
    console.log(res); 
    $('#example_form').trigger('reset'); // сбрасываем данные формы 
  }).fail(function(err) { 
    alert('Ошибка передачи запроса.'); 
    console.log(err); 
  }); 
});
#example_form input, 
#example_form textarea, 
#example_form button { 
  display: block; 
  margin-bottom: 1rem; 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form id="example_form"> 
  <input type="text" name="fio" placeholder="Ф.И.О." /> 
  <input type="number" name="phone" placeholder="Номер телефона" /> 
  <textarea rows="10" cols="45" name="additional" placeholder="Дополнительная информация"></textarea> 
 
  <button type="submit">Отправить данные</button> 
</form>

READ ALSO
Как в javascript &ldquo;закрывать&rdquo; div при клике вне этого дива?

Как в javascript “закрывать” div при клике вне этого дива?

При клике по некоторому элементу управления на экране появляется div c текстом подсказокУ дива есть кнопка "закрыть"

226
После JS не работает CSS

После JS не работает CSS

Столкнулся с такой вот проблемойВ скрытом блоке содержаться Slick-slider, после того, как блок активирую, изображения появляются в миниатюрном...

230
ReferenceError: event is not defined

ReferenceError: event is not defined

Вот этот код выдаёт ReferenceError: event is not defined

246
Выпадающий блок меню на ajax

Выпадающий блок меню на ajax

Никто не встречал нигде готового решения для выпадающего меню? чтобы верстки кусок div грузился при наведении на кнопку меню? Много методов...

161