2015-12-15 25 views
1

然後,我想填充jQuery手風琴模型中動態創建的手風琴面板的字段。該字段將填充來自主要問題字段的信息。我可以使用jquery函數創建動態面板,但是我在如何使用我的程序中主文本字段的數據填充面板字段時遇到問題(頂部Jquery手風琴:在動態創建的面板中填充文本字段

我可以做相反的事情,即填充。用的「編輯」按鈕,點擊面板領域的主要領域

這裏是輸出:https://jsfiddle.net/0fysejrh/1/

我的代碼如下:

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>jQuery UI Accordion - Default functionality</title> 
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> 
    <script src="http://code.jquery.com/jquery-1.10.2.js"></script> 
    <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
    <script> 
    var counter = 3; 
    $(function() { 
    $("#accordion").accordion({ 
     collapsible: true, 
     active: false, 
     }); 
    collapsible: true; 

    function edit(){ 
    var text = $(this).siblings("input[type=text]").val(); 
    var sql = $(this).siblings('textarea').val(); 
    $("#input").val(text); 
    } 
    $(":button").click(edit); 

    $("#addAccordion").click(function() { 
     var newDiv = '<div><h3>Question '+ counter +'</h3></div>'; 
     var content = '<div class = "new_panel"><label for="in" name="question">Edit Question:</label> <input type="text" name = "question" /><br><br>' + 
     '<br><br> <input type = "button" value = "Edit" ></input></div>'; 
     $("#accordion").append(newDiv +content) ; 
     $("#accordion").accordion("refresh"); 
     $(".new_panel").children("input[type=text]").val()==$("#input").val(); 

     counter++; 
     $(":button").click(edit); 
    }); 
    }); 
    </script> 
</head> 
<body> 

<center> 
<form id="myform"> 
    <label>Enter Question:</label> 
    <input id="input" type="text" name = "questions"/> 
    <br><br> 
    <input id = "submitbutton" type="submit" value="Submit"/> 
    <input type = "button" id ="addAccordion" value = "Add Question" ></input> 
</form> 
</center> 

<div id = "accordion"> 
    <h3> Question 1 </h3> 
    <div> 
     <form> 
      How many times a day do you take ventolin ? 
      <br><br> 

      <label for="in" name="question">Edit Question:</label> 
      <input type="text" name = "question" /> 

      <br><br> 
      <input type = "button" value = "Edit" ></input> 

      </form> 
    </div> 
    <h3> Question 2 </h3> 
    <div> 
     <form> 
      Have you ever been tested for an STI? 
      <br><br> 
      <label for="in" name="question1">Edit Question:</label> 
      <input type="text"/> 
      <br><br> 
      <input type = "button" value = "Edit" ></input> 
      </form> 
    </div> 

</div> 
</body> 
</html> 

的問題在於以下代碼行不行RK:

$(".new_panel").children("input[type=text]").val()==$("#input").val(); 

其中「.new_panel」是我做動態的類名,‘#INPUT’是主要的文本字段的唯一ID。

我試過使用類i.d.的新面板,但這似乎並不奏效。有人能指引我朝着正確的方向嗎?

回答

1

你可以做什麼是一個變量,然後輸入其保存輸入的值的newDiv

var inputVal = $("#input").val(); 
var newDiv = '<h3>Question '+ counter +'</h3>'; 
var content = '<div class = "new-panel"><label for="in" name="question">Edit Question:</label> <input type="text" name = "question" value="'+inputVal+'" /><br><br>'+ '<br><br> <input type = "button" value = "Edit" ></input></form></div>'; 
$("#accordion").append(newDiv +content) ; 
$("#accordion").accordion("refresh"); 
counter++; 
$(":button").click(edit); 
你哪裏還使用==你要記住,

部分比較不是asignment operator

https://jsfiddle.net/nyye5bmg/