2011-02-28 5 views
0

ID가 1 - n 인 링크가 한 묶음이고 양식의 숨겨진 입력에 해당 ID를 전달하고 싶습니다 (여러 링크가 있지만 한 가지 형식 만 갖고 싶음) 각 ID에 대한 양식을 만드는 HTML의 수천 개의 추가 라인을 생성하는 것이 아니라).jQuery로 숨겨진 입력에 값 전달

링크는 다음과 같습니다

<a href='javascript:$("#removeSave").submit()' id="n">Remove</a> 

숨겨진 입력이 양식은 다음과 같습니다

<form action="/php/removeSave.php" method="POST" id="removeSave"> 
    <input type="hidden" name="ID" value=""/> 
</form> 

어떤 도움? 그것은 form을 제출하기 전에

+4

주어진 링크에 ID가없는 것 같습니다. 또한 명확성을 위해 ID는 숫자로 시작할 수 없습니다. – kojiro

+0

죄송합니다. 링크 아이디가 추가되었습니다. – AKor

답변

2

이는 a 요소의 id에 ID ID에 숨겨진 input의 값을 설정합니다.

<a href='#' id='n' onclick='$("#ID").val(this.id);$("#removeSave").submit();'>Remove</a> 


<form action="/php/removeSave.php" method="POST" id="removeSave"> 
    <input type="hidden" name="ID" id="ID" value=""/> 
</form> 
+1

ISO8879 (http://www.w3.org/TR/html4/types.html#h-6.2 참조)에 따르면 ID 속성은 문자로 시작해야합니다 (따라서'... id = "123 "..."는 유효하지 않을 것입니다. 물론 "id"같은 것을 접두어로 붙인 다음에 'this.id.replace (/ \ D/g, ") 숫자를 출력합니다. –

0

ID가 표시된 "제거"링크의 전체 컨텍스트를 제공하지 않았으므로 형식을 추정하고 거기에서 적응할 수 있습니다.

<!-- HTML //--> 

<!-- Format for Each Element. "123" is the ID here //--> 
<div id="element123"> 
    This is Element 123 (ID#123) 
    <a href="/php/removeSave.php?ID=123">Remove</a> 
</div> 

<!-- The Form at the Bottom of the Page //--> 
<form id="removeSave" method="POST" action="/php/removeSave.php"> 
    <input type="hidden" name="ID" value="" /> 
</form> 

JQuery와 세그먼트이 방법의

<script type="text/javascript"> 
$(document).ready(function(){ 

// Clicks of Links starting with "/php/removeSave.php?ID=" 
    $('a[href^="/php/removeSave.php?ID="]').click(function(e){ 
    // Don't let the Link act as a basic link 
    e.preventDefault(); 
    // Get the Link HREF attribute 
    href = $(this).attr('href'); 
    // Derive the Form ID and ID Value 
    bits = href.match(/^\/php\/([^\.]+)\.php\?ID=(\d+)/); 
    formID = bits[1]; 
    elementID = bits[2]; 
    // Set the Field Values and Submit the Form 
    $form = $('#'+formID); 
    $form.find('input[name="ID"]').val(elementID); 
    $form.submit(); 
    }); 

}); 
</script> 

장점?

Graceful Degradation - PHP 스크립트가 GET 변수를 처리 할 수있는 경우 Javascruipt가 활성화되지 않은 브라우저에서이 페이지를로드하거나 jQuery를로드 할 수없는 경우 "제거"링크를 클릭해도 여전히 GET 변수를 처리 할 수 ​​있습니다. 예상되는 동작을 수행하십시오. AJAX-ification에 대한

기회 - 대신 .click(function(e){ 섹션 내의 모든 다른 작업, 당신은 핸들러로 바로이 요청을 전달하는 jQuery의 $.post() 기능과 링크의 HREF의 쿼리 문자열 세그먼트를 사용하지 않고 페이지를 조작 할 수있다 전체 페이지 새로 고침을 할 수 있습니다.