2013-03-01 4 views
0

ASP.NET 컨트롤을 사용해야하는 데이터베이스의 데이터를 사용하여 편집 가능한 양식을 작성 중입니다. 이 작업은 HTML로 처리되었지만 .NET 부분을 추가하면 막혔습니다.jQuery ASP.NET 드롭 다운리스트로 레이블 바꾸기

다음과 같은 상황이 있습니다. 아래에 수정 단추가있는 레이블이 페이지에 표시되어 있습니다. 편집 버튼을 누르면 레이블이 데이터베이스의 데이터가있는 .NET 드롭 다운 목록이됩니다. 사용자가 저장을 클릭하면 드롭 다운 목록은 선택한 값을 표시하는 레이블로 돌아갑니다.

내 문제는 편집 단추를 클릭하면 드롭 다운 목록이 나타나지 않는다는 것입니다. 여기

코드입니다 :

의 .ascx

<li> 
    Campus 
    <br /> 
    <span class="datainfoDropdown"> 
     <strong> 
      <asp:Literal ID="CampusAttended" runat="server" ClientIDMode="Static"/> 
     </strong> 
     <asp:DropDownList ID="ProfileCampusDropDown" runat="server" ClientIDMode="Static" style="display:none;" ></asp:DropDownList> 
    </span> 
    <a href="#" class="editlinkDropdown">Edit Info</a> 
    <a class="savebtnDropdown">Save</a> 
</li> 

자바 스크립트

$(".editlinkDropdown").on("click", function (e) { 
    e.preventDefault(); 
    var datasets = $(this).prevAll(".datainfoDropdown"); 
    var savebtn = $(this).next(".savebtnDropdown"); 
    datasets.each(function() { 
     var theid = $(this).attr("id"); 
     var currval = $(this).text(); 
     var dropDown = $('#ProfileCampusDropDown').html(); 
     $('.datainfoDropdown').html(dropDown); 
    }); 

    $(this).css("display", "none"); 
    savebtn.css("display", "block"); 
}); 

$(".savebtnDropdown").on("click", function (e) { 
    e.preventDefault(); 
    var elink = $(this).prev(".editlinkDropdown"); 
    var datasets = $(this).prevAll(".datainfoDropdown"); 
    datasets.each(function() { 
     var newid = $(this).attr("id"); 
     var einput = $("#" + newid + "-form"); 
     var newval = $('#ProfileCampusDropDown :selected').text(); 
     //einput.remove(); 
     $(this).html('<strong>' + newval + '</strong>'); 
    }); 

    $(this).css("display", "none"); 
    elink.css("display", "block"); 
}); 

어떻게 내 편집 버튼 드롭 다운 목록을 표시하려면 어떻게해야합니까?

답변

1

코드를 보면 달성하고자하는 것이 분명하지 않습니다. 나는 id와 "-form"의 요점을 보지 않는다고 고백해야한다. 나는 무엇인가 놓쳤을 것임에 틀림 없었다.

어쨌든 나는 이것이 내가 거기에 아무 문제가없는 것 같아요

+0

효과가있었습니다! 새로운 것을 가르쳐 주셔서 감사합니다! –

0

ASP.NET에서이 위치를 알 수는 없지만 서버에서 asp.net 컨트롤에 설정된 ID를 변경하는 것이 좋습니다.

이 경우 컨트롤의 CssClass 특성을 설정하고 $(".class") 선택기 인 jQuery를 사용하십시오.

+1

도움이 될 것입니다 이것은 당신의 (a display:none;ProfileCampusDropDownsavebtnDropdown 시작 제공) 무엇을 설명

$(".editlinkDropdown").on("click", function (e) { e.preventDefault(); $(this).prevAll(".datainfoDropdown").find("strong").hide(); $('#ProfileCampusDropDown').show(); $(this).hide(); $(this).next(".savebtnDropdown").show(); }); $(".savebtnDropdown").on("click", function (e) { e.preventDefault(); var strong = $(this).prevAll(".datainfoDropdown").find("strong"); strong.html($('#ProfileCampusDropDown :selected').text()); strong.show(); $('#ProfileCampusDropDown').hide(); $(this).hide(); $(this).prev(".editlinkDropdown").show(); }); 

희망을해야 할 것 같아요. 컨트롤에는 ClientIDMode = "Static"이 있습니다. – jbl