Передача значения формы html через json/ajax

У меня есть базовая форма html, и я пытаюсь использовать jquery и json для передачи значения формы в PHP. Я новичок в этом, но я провел много исследований, и я думал, что все в порядке. Страница больше не перезагружается, когда я нажимаю submit (и это поведение, которое я хочу), но я закодировал предупреждение javascript, чтобы узнать, передаются ли данные и что предупреждение не работает. Я рассматривал этот код часами, и я не могу найти никаких ошибок. Может кто-нибудь сказать мне, почему предупреждение не работает?Передача значения формы html через json/ajax

вот мой main.php

<!DOCTYPE html> 
<html> 
<head> 

    <title>leader</title> 


<link rel="stylesheet" type="text/css" href="main.css"> 

</head> 

<body> 
<div class = "container"> 
<form action="post.php" method="post" id="add"> 
<input type="text" class="leader" name="name" placeholder="Leader"> 
<input type="submit" value="send" /> 
</form> 


<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script> 
<script type="text/javascript" src="jquery-ui-1.10.4.custom.js"></script> 
<script src="globe.js"></script> 


<ul id ="hours_zoned"> 
    <li class="nine">9</li> 
    <li class="ten">10</li> 
    <li class="eleven">11</li> 
    <li class="twelve">12</li> 
    <li class="one">1</li> 
    <li class="two">2</li> 
    <li class="three">3</li> 
    <li class="four">4</li> 
    <li class="five">5</li> 
    <li class="six">6</li> 
    <li class="seven">7</li> 
    <li class="eight">8</li> 
    <li class="nine">9</li> 
</ul> 
</div> 




</body> 
</html>

здесь мои globe.js

$('#add').on('submit', function() { 
     var name = $('.leader').val(); 

     $.ajax({ 
     url: 'post.php', 
     dataType: 'json', 
     type: 'post', 
     data: name, 
     success: function (data) { 
      if(data.success) { 
       alert('the result is ' + data.result); 
       } 
     } 

     }); 
     return false; 
    });

вот мой post.php

<?php 
header('Content-type: text/javascript'); 

$json = array(
    'success' => false, 
    'result' => 0 

); 


if(isset($_POST['name'])) { 
    $name = $_POST['name']; 

    $json['success'] = true; 
    $json['result'] = $name; 
} 

echo json_encode($json); 
?>

источник

2014-04-24 jonjon

Малые проверки биты и куски: Что является результатом console.log (данные) в блоке успеха? И каков результат var_dump ($ _ POST) в скрипте? – M4Numbers

Внесите изменения в globe.js и она работает:

$('#add').on('submit', function() { 
     var name = $('.leader').val(); 

     $.ajax({ 
     url: 'post.php', 
     dataType: 'json', 
     type: 'post', 
     data: 'name='+name, 
     success: function (data) { 
      if(data.success) { 

       alert('the result is ' + data.result); 
       } 
     } 

     }); 
     return false; 
    });

источник

2014-04-24 04:00:34

Спасибо! Это определенно сработало! Я не уверен, почему нам пришлось использовать «+» перед именем, но я посмотрю документацию и посмотрю, смогу ли я узнать об этом больше. Благодаря! – jonjon

Я не знаю, если тот Ассоль но я считаю, что ваш атрибут data должен быть объектом.

$('#add').on('submit', function() { 
    var name = $('.leader').val(); 

    $.ajax({ 
    url: 'post.php', 
    dataType: 'json', 
    type: 'post', 
    data:{ 
     name : 'Name value' 
    }, 
    success: function (data) { 
     if(data.success) { 
      alert('the result is ' + data.result); 
      } 
    } 

    }); 
    return false; 
});

источник

2014-04-24 01:42:51 intelis

Передача значения формы html через json/ajax

ответ

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