2016-06-22 2 views
0

Я изучаю HTML и javascript. Я застрял в одном месте. Мое требование - сделать вызов API REST и получить значение, а затем перенаправить страницу на другой URL.Получить данные из REST и перенаправить на другую страницу

Код сниппета:

HTML

<!DOCTYPE html> 
<html> 
<body> 

    //REST SERVICE CALL 
    <form action="http://localhost:51349/SMS_Rest.svc/v1/CheckBox" method="get" > 
     <input type="checkbox" id = "1" name="graphId" value="1"> Graph1<br> 
     <input type="checkbox" id = "2" name="graphId" value="2"> Graph2<br> 
     <input type="checkbox" id = "3" name="graphId" value="3"> Graph3<br> 
     <input type="checkbox" id = "4" name="graphId" value="4"> Graph4<br> 
     <input type="submit"> 
    </form> 

</body> 
</html> 

Когда я ударил Submit я получаю ответ от REST службы как TRUE. Но URL-адрес, который я перенаправляю, автоматически совпадает с URL-адресом REST, указанным в поле действия HTML. Но я хочу получить данные из REST, а затем перенаправить пользователя на другую страницу. Имею ли я смысл здесь. Пожалуйста, помогите мне.

+1

Я думаю, что вы наблюдаете за получением данных через ajax, а когда закончите, переадресовываете с помощью javascript. Не отправляйте форму в свой API. Читайте о jquery AJAX calls.http: //api.jquery.com/jquery.ajax/ – Leeish

ответ

1

Лучшее решение, которое я могу думать о том, чтобы отправить форму с AJAX затем перенаправить к URL, который вы хотите:

Сначала вам нужно JQuery плагин Form - Ajax Form Plugin Затем после добавления идентификатора =» rest-form "в вашу форму:

jQuery("#rest-form").submit(function(e){ 
    //The following stops the form from redirecting 
    e.preventDefault(); 
    jQuery("#rest-form").ajaxSubmit({ 
     type: 'GET', 
     url: jQuery('#rest-form').attr('action'), 
     data: jQuery('#rest-form').serialize(), 
     success: function (data) { 
      //The data variable will contain the response data 
      //if it's successful, you can no redirect wherever you want 
      window.location.href = "http://www.example.com"; 
     } 
    }); 
}); 
0

Это передача, которая вызывает перенаправление. Я предлагаю вам использовать вызов AJAX, что-то вроде этого:

var xhttp = new XMLHttpRequest(); 
xhttp.open("GET", "http://localhost:51349/SMS_Rest.svc/v1/CheckBox?graphId=" + graphId, true); 
xhttp.send(); 
var response = xhttp.responseText; 

Получить ответ на запрос, и если правильно редирект так:

document.location.href="redirectionTarget"; 

EDIT: Native Javascript немного дерьмовый , вы можете использовать библиотеку, например, jquery, как упоминается Leeish.

1

Из того, что вы использовали в своем вопросе, вы используете форму для вызова REST? Это не обычный способ вызова REST. Но если вы настаиваете на этом, вы должны изменить ответ вашей службы REST реагировать с переадресацией, такие как:

HTTP/1.1 301 Moved Permanently 
Location: http://www.example.org/otherpage 

Другой способ сделать, чтобы это было бы опубликовать форму на не REST конечной точки который, например, выполнил бы проверку вашей формы. Если вам нужно позвонить в службу REST, прежде чем выполнять какую-либо другую проверку на стороне клиента, вы должны использовать window.XMLHttpRequest для асинхронной обработки запроса REST перед отправкой формы (событие onsubmit). Здесь вы найдете более подробную информацию о том, как это сделать: http://rest.elkstein.org/2008/02/using-rest-in-javascript.html

Но, возможно, вам просто нужно разместить свою форму в обычном порядке, в зависимости от вашего прецедента. Но предоставление формы службе REST, вероятно, не является стандартным подходом, который вы хотите использовать.

+0

Вы совершенно правы. Поскольку я учился, у меня не было всей этой идеи. Я должен изменить свой код. – Unbreakable

Смежные вопросы