Блог

Главная - Вопросы по программированию - Невозможно опубликовать элементы динамической формы, созданные с помощью javascript

Невозможно опубликовать элементы динамической формы, созданные с помощью javascript

#javascript #forms

#javascript #формы

Вопрос:

Я пытаюсь опубликовать элементы динамической формы, добавленные с помощью javascript, но не могу этого сделать. Элементы отображаются, когда я их добавляю, но ничего не вижу на test.php страница.

Я пытался разобраться в проблеме, но тщетно. Я также использовал Firebug для проверки элементов DOM, но это выглядело нормально. Пожалуйста, помогите

Вот мой код:

 <html>
<head>
<script type="text/javascript">

function add() {

//Create an input type dynamically.
var element1 = document.createElement("input");
var element2 = document.createElement("input");
var newdiv = document.createElement("button");
var space = document.createElement("div");
//Assign different attributes to the element.

element1.setAttribute("type", "text");
element2.setAttribute("type", "text");
//newdiv.setAttribute("type", "button");
//element.setAttribute("value", type);
//element.setAttribute("name", type);
var numi = document.getElementById('theValue');
var num = (document.getElementById('theValue').value -1)  2;
numi.value = num;

var area = document.getElementById('area');

var divIdName1 = 'name' num;
var divIdName2 = 'amount' num;
var divIdName3 = 'button' num;

element1.setAttribute('id',divIdName1);
element2.setAttribute('id',divIdName2);
newdiv.setAttribute('id',divIdName3);

element1.setAttribute('value',divIdName1);
element2.setAttribute('value',divIdName2);
newdiv.setAttribute('value','harsh');

//  element2.setAttribute('id', );

//Append the element in page (in span).
space.innerHTML='<br />';
newdiv.onclick =  function() {
//document.write(divIdName1);
var olddiv = document.getElementById(divIdName1);
area.removeChild(olddiv);
olddiv = document.getElementById(divIdName2);
area.removeChild(olddiv);
olddiv = document.getElementById(divIdName3);
area.removeChild(olddiv);
area.removeChild(space);
}



area.appendChild(element1);
area.appendChild(element2);
area.appendChild(newdiv);
area.appendChild(space);
}
</script>
</head>
<body>
<form id="frmMain" name="frmMain" method=get action=test.php>

    <input type="hidden" value="0" id="theValue" />
        <div id="area">
            <input type="button" value=" " onclick="add()"/>
            <br />
            <br />
       </div> 
       <input type=submit value=submit>
</form>
</body>
</html>


PHP code : test.php

<?
echo "<h1>Form posted with Ajax</h1>";
echo "<h4>POST variables</h4>";
print_r($_POST);
foreach($_POST as $key=>$value){
echo "yes";
if(is_array($value)){       
    for($no=0;$no<count($value);$no  ){
        echo "<b>".$key."[$no]</b>: ".$value[$no]."<br>";   
    }
}else{
    echo "<b>".$key."</b>: ".$value."<br>";
}


}

echo "<h4>GET variables:</h4>";
foreach($_GET as $key=>$value){
if(is_array($value)){       
    for($no=0;$no<count($value);$no  ){
        echo "<b>".$key."[$no]</b>: ".$value[$no]."<br>";   
    }
}else{
    echo "<b>".$key."</b>: ".$value."<br>";
}

}

?>

Ответ №1:

Похоже, что вы присвоили им value атрибуты и id атрибутики, но вы не предоставили им name атрибуты, которые понадобятся браузеру для их отправки, чтобы они отображались в PHP в $_POST :

 // id attrs
element1.setAttribute('id',divIdName1);
element2.setAttribute('id',divIdName2);
newdiv.setAttribute('id',divIdName3);

//  Value attrs
element1.setAttribute('value',divIdName1);
element2.setAttribute('value',divIdName2);
newdiv.setAttribute('value','harsh');

// Don't forget name attrs
element1.setAttribute('name','somename1');
element2.setAttribute('name','somename2');
newdiv.setAttribute('name','someval');

Комментарии:

1. @user1044209 Рад помочь и добро пожаловать в Stack Overflow. Если вы удовлетворены ответом, пожалуйста, отметьте его как принятый, нажав на галочку рядом с ним.

2. Некоторые браузеры ( кашель IE) будут вызывать проблемы при назначении «жизненно важных» свойств через setAttribute . Ради них используйте element1.name = 'somename1'; element2.name = 'somename2'; вместо этого. Также стоит упомянуть, что в IE7 (возможно, также 8, не могу вспомнить) будет передана внутренняя HTML-кнопка, а не ее значение.