2009-06-16 4 views
0

jQuery를 사용하는 ASP.NET 응용 프로그램이 있습니다. 내 ASP.NET 응용 프로그램은 데이터베이스의 일부 값을 기반으로 일부 HyperLink 요소를 동적으로 생성합니다. 사용자가 이러한 HyperLink 요소 중 하나를 클릭하면 사용자가 HyperLink의 텍스트를 편집 할 수있는 jQuery 대화 상자를 표시하려고합니다. 나는이 부분을 일하고있다.ASP.NET + jQuery + 동적으로 생성 된 HyperLink 컨트롤

사용자가 "저장"버튼을 클릭하면 HyperLink 요소의 값을 읽고이를 데이터베이스에 다시 저장해야합니다. 현재 HyperLink 요소의 초기 값을 얻습니다. 그러나 수정 된 값을 얻을 수는 없습니다. 사용자가 제공 한 값을 얻으려면 어떻게해야합니까?

보고서

테스트 : 나는 내에서 .aspx 여기 .aspx.cs 코드를 제공 한

<div id="recommendDialog" title="Number"> 
     <table border="0" cellpadding="0" cellspacing="0"> 
      <tr><td>Number</td></tr> 
      <tr><td><input id="optionName" type="text" /></td></tr> 
     </table> 
    </div> 

    <asp:Button ID="saveButton" runat="server" Text="Save" OnClick="saveButton_Click" /> 
</div> 
</form>  

<script type="text/javascript"> 
    var editingID = null; 

    $("#recommendDialog").dialog({ 
     autoOpen: false, 
     height: 200, 
     modal: true, 
     buttons: { 
      Cancel: function() { 
       $(this).dialog('close'); 
      }, 

      'OK': function() { 
       var newValue = $("#optionName").val(); 
       if (editingID != null) { 
        $(editingID).attr("name", newValue); 
        $(editingID).html(newValue); 
       } 
       $(this).dialog('close'); 
      } 
     }, 
     close: function() { 

     } 
    }); 

    function update_Click(link) { 
     editingID = "#" + link.id; 
     $("#optionName").val(link.name); 
     $('#recommendDialog').dialog('open');    
    } 
</script> 

공공 부분 클래스 _Default :여기

내 코드 숨김입니다 System.Web.UI.Page { 보호 재정의 무효하는 OnInit (EventArgs입니다 전자) { base.OnInit (전자); AddHyperlinks(); }

protected void Page_Load(object sender, EventArgs e) 
{} 

protected void saveButton_Click(object sender, EventArgs e) 
{ 
    foreach (TableCell cell in reportTable.Rows[0].Cells) 
    { 
     HyperLink h = (HyperLink)(cell.Controls[0]); 
     string newValue = h.Attributes["name"]; 

     // Save value to database here. newValue does not show 
     // changed values. 
     Console.WriteLine(newValue); 
    } 
} 

private void AddHyperlinks() 
{ 
    TableRow row = new TableRow(); 
    for (int i = 1; i < 11; i++) 
    { 
     HyperLink hyperlink = new HyperLink(); 
     hyperlink.NavigateUrl = "#"; 
     hyperlink.Text = i.ToString(); 
     hyperlink.Attributes.Add("id", "h" + i); 
     hyperlink.Attributes.Add("name", i.ToString()); 
     hyperlink.Attributes.Add("onclick", "update_Click(this);"); 
     AddLinkButtonToRow(hyperlink, row); 
    } 
    reportTable.Rows.Add(row); 
} 

private void AddLinkButtonToRow(HyperLink linkButton, TableRow row) 
{ 
    TableCell cell = new TableCell(); 
    cell.Controls.Add(linkButton); 
    row.Cells.Add(cell); 
} 

}

+0

데이터베이스 업데이트를 수행하는 부분이 누락 되었습니까? jquery ajax를 통해이 작업을 수행해야합니다. – ScottE

+0

그런데 Dave : 입력 필드 (TextBox)를 사용하면 코드가 훨씬 더 깨끗해 보입니다. 마치 10 개의 문자열 만 읽는 것처럼 보입니다. – Kobi

답변

1

당신이하려는 것은 그렇게 할 수 없습니다. 페이지를 만들 때마다 링크를 만듭니다. 자바 스크립트에서 이러한 링크의 이름을 변경하더라도 이러한 값은 다시 게시되지 않습니다.
Sumbit에서 <a> 요소가 아닌 양식 요소 (예 :)가 서버에 다시 게시되므로 서버가 변경 사항을 "알지 못합니다".

둘째, <a><input>으로 변경하더라도 여전히 문제가 있습니다. reportTable.Rows[0].Cells에서 예상대로 값을 찾을 수 없습니다. 일반적으로 asp.net은 동적으로 생성 된 컨트롤에 대해서도이 값을 올바르게 채 웁니다. 그러나 여기서는 그렇지 않습니다 - 이름을 변경 했으므로! Asp.net은 이러한 값을 리 바인드 할 수 없습니다.

그럼 어떻게해야합니까? 하나의 옵션은 모든 셀에 숨겨진 필드를 추가하는 것입니다.AddLinkButtonToRow
다음을 추가 : 당신이 알고있는 것 같다 jQuery를 사용하여,

HtmlInputHidden hidden = new HtmlInputHidden(); 
hidden.ID = "hidden" + linkButton.ID; 
hidden.Name = hidden.ID; //so it will be posted! 
hidden.Style["display"] = "none"; //better to have a CssClass 

에서, 값을 다음 입력 필드의이 아닌 자신의 이름 ($(editingID).parent().find(":hidden") 같은)을 변경합니다.

다음으로 컨트롤에 값이 표시되지 않지만 Request.Form["hiddenh1"] ... Request.Form["hiddenh11"]에서 찾을 수 있습니다. - 모든 입력 필드 이름이 게시되고 이번에는 이름을 알고 있습니다.

0

내가 어디에 있는지 또는 어떤 "ReportTable"아니에요 그리고 tablecells 있습니다,하지만 난 당신의 문제를 추측하고있어 당신은 몇 가지 태그의 값을 조작하고 있다는 것입니다 jQuery를 사용하는 클라이언트가 서버에 다시 게시 될 것으로 기대하고 있습니까?

이것은 작동하지 않습니다. 이 페이지는 ViewState에서 HyperLink 컨트롤의 알려진 값으로 렌더링됩니다. 태그는 입력 유형이 아니므로 다시 게시시 서버에 값을 게시하지 않으며 ViewState는 항상 원래 값으로 다시 초기화합니다. 모든 조작은 서버 측에서 수행해야합니다.

ScottE이 제안한 것을 수행하고 jquery ajax로 업데이트하는 것이 좋습니다.

관련 문제