$ .post в скрипте не работает - PullRequest
Новая
       48

$ .post в скрипте не работает

0 голосов
/ 19 июня 2011

Мне нужно добавить несколько новых элементов на страницу по нажатию кнопки.Я не понимаю - когда я делаю все шаг за шагом с fireBug - все в порядке.Если я выключу Firebug - ничего не добавится.Это код js: 

    function Appending()
{
    var id = document.getElementById("default-id").value;
    id++;
    var result = $.post("addForm.php",{idEl:id},"html");
    $('#vrWrapper').append(result.responseText);
    document.getElementById("default-id").value = id; 
}
function removeInput(id) {
    $("#" + id).remove();
}

А вот код PHP (addForm.php): 

<?php
$id=$_POST["idEl"];
echo '<div class="data" id="'.$id.'"><div class ="userdata"><div class = "input"> <label for="lastName">Last Name:</label> <input id="lastName" type="text"/></div><div class = "input"> <label for="firstName">First Name:</label> <input id="firstName" type="text" /></div><div class = "input"> <label for="city">City:</label> <input id="city" type="text"/></div><div class = "input"> <label for="state">State:</label> <select name="state"><option value="AL">Alabama</option><option value="AK">Alaska</option><option value="AZ">Arizona</option><option value="AR">Arkansas</option><option value="CA">California</option><option value="CO">Colorado</option><option value="CT">Connecticut</option><option value="DE">Delaware</option><option value="DC">District of Columbia</option><option value="FL">Florida</option><option value="GA">Georgia</option><option value="HI">Hawaii</option><option value="ID">Idaho</option><option value="IL">Illinois</option><option value="IN">Indiana</option><option value="IA">Iowa</option><option value="KS">Kansas</option><option value="KY">Kentucky</option><option value="LA">Louisiana</option><option value="ME">Maine</option><option value="MD">Maryland</option><option value="MA">Massachusetts</option><option value="MI">Michigan</option><option value="MN">Minnesota</option><option value="MS">Mississippi</option><option value="MO">Missouri</option><option value="MT">Montana</option><option value="NE">Nebraska</option><option value="NV">Nevada</option><option value="NH">New Hampshire</option><option value="NJ">New Jersey</option><option value="NM">New Mexico</option><option value="NY">New York</option><option value="NC">North Carolina</option><option value="ND">North Dakota</option><option value="OH">Ohio</option><option value="OK">Oklahoma</option><option value="OR">Oregon</option><option value="PA">Pennsylvania</option><option value="RI">Rhode Island</option><option value="SC">South Carolina</option><option value="SD">South Dakota</option><option value="TN">Tennessee</option><option value="TX">Texas</option><option value="UT">Utah</option><option value="VT">Vermont</option><option value="VA">Virginia</option><option value="WA">Washington</option><option value="WV">West Virginia</option><option value="WI">Wisconsin</option><option value="WY">Wyoming</option></select></div></div><div class ="workdata"><div class = "input"><input id="ch1" type="checkbox" class="check" /><label for="ch1">Немирович (бригадир)</label></div><div class = "input"><input id="ch2" type="checkbox" class="check" /><label for="ch1">Немирович (бригадир)</label></div><div class = "input"><input id="ch3" type="checkbox" class="check" /><label for="ch1">Немирович (бригадир)</label></div><div class = "input"><input id="ch4" type="checkbox" class="check" /><label for="ch1">Немирович (бригадир)</label></div><div class = "input"><input id="ch1" type="checkbox" class="check" /><label for="ch1">Немирович (бригадир)</label></div></div><div class ="buttons"><button type="button" id="addAdult" onClick="Appending()">Add Adult</button><button type="button" id="register">Register</button><button type="button" id="cancel" onClick = "removeInput('.$id.')">Cancel</button></div></div>';
?>

Действительно странно, что все правильно - FireBug не показывает ошибок

Здесь вы можете увидеть это в действии: http://tvorchestva.net/test/form/form.html

Ответы [ 3 ]

4 голосов
/ 19 июня 2011

Поместите ваш код в обратный вызов на post. 

function Appending()
{
    var el = document.getElementById("default-id");  // cache the selection
    var id = el.value;
    id++;
    el.value = id; 
    $.post("addForm.php",{idEl:id},function( htm ) {
        $('#vrWrapper').append( htm );  // <--  run after response is received
    },"html");
}

Вы можете использовать другую форму в более новых версиях jQuery из-за отличия.

На основании примера из документов: 

$.post("example.php", function() {
      alert("success");
    })
    .success(function() { alert("second success"); })
    .error(function() { alert("error"); })
    .complete(function() { alert("complete"); });
0 голосов
/ 19 июня 2011

Проблема в том, что $. Post ожидает, что функция в случае успеха вызовет функцию в качестве третьего параметра, но вы передаете "html".

Попробуйте заменить 

$.post("addForm.php",{idEl:id},"html");

с 

$.post("addForm.php", {idEl:id}, function(d) {
    $('#vrWrapper').append( d );
}); );

Как указывается в документации jQuery, «большинство реализаций будут указывать обработчик успеха;»в их примере они «выбирают запрошенный фрагмент HTML и вставляют его на страницу», и это именно то, что вы пытаетесь сделать.

0 голосов
/ 19 июня 2011

попробуйте это 

function Appending() {
    var id = document.getElementById("default-id").value;
    id++;
    $.post("addForm.php", {
        idEl: id
    }, function(html) {
        $('#vrWrapper').append(html);
    });

    document.getElementById("default-id").value = id;
}

function removeInput(id) {
    $("#" + id).remove();
}
...