여러 양식 필드 그룹을 동적으로 작성하고 처리합니다.

Question

JS 및 PHP를 기반으로하는 소규모 주문 페이지를 작성 중이며 양식 데이터를 처리하는 방법에 관해서 약간 고생했습니다. 양식에서 사용자는 하나 이상의 제품을 주문할 수 있어야하며 각 제품에는 라디오 버튼의 형태로 몇 가지 설정이 있습니다. 사용자가 하나 이상의 제품 부품을 추가하는 경우

newUnit = newUnit.replace(/name="unitPrice/g, 'name="unitPrice' + i); 
    newUnit = newUnit.replace(/name="body/g, 'name="body' + i); 
    newUnit = newUnit.replace(/name="details/g, 'name="details' + i); 
    newUnit = newUnit.replace(/name="topShelf/g, 'name="topShelf' + i); 


<div class="unit"> 
    <input type="hidden" class="unitPrice" name="unitPrice" value="0" data-price="6900"> 
    <div class="row"> 
     <div class="col-sm-3"> 
      <fieldset class="form-group options-body"> 
       <legend>Body</legend> 
       <div class="form-check"> 
        <label class="form-check-label"> 
         <input type="radio" class="form-check-input" data-price="0" name="body" value="White Ash" checked> 
         White Ash 
        </label> 
       </div> 
       <div class="form-check"> 
        <label class="form-check-label"> 
         <input type="radio" class="form-check-input" data-price="0" name="body" value="Black Ash"> 
         Black Ash 
        </label> 
       </div> 
       <div class="form-check"> 
        <label class="form-check-label"> 
         <input type="radio" class="form-check-input" data-price="800" name="body" value="Walnut"> 
         Walnut (+800) 
        </label> 
       </div> 
      </fieldset> 
     </div> 
    </div> 
</div> 
<div class="unit"> 
    <input type="hidden" class="unitPrice" name="unitPrice" value="0" data-price="6900"> 
    <div class="row"> 
     <div class="col-sm-3"> 
      <fieldset class="form-group options-body"> 
       <legend>Body</legend> 
       <div class="form-check"> 
        <label class="form-check-label"> 
         <input type="radio" class="form-check-input" data-price="0" name="body2" value="White Ash" checked> 
         White Ash 
        </label> 
       </div> 
       <div class="form-check"> 
        <label class="form-check-label"> 
         <input type="radio" class="form-check-input" data-price="0" name="body2" value="Black Ash"> 
         Black Ash 
        </label> 
       </div> 
       <div class="form-check"> 
        <label class="form-check-label"> 
         <input type="radio" class="form-check-input" data-price="800" name="body2" value="Walnut"> 
         Walnut (+800) 
        </label> 
       </div> 
      </fieldset> 
     </div> 
    </div> 
</div> 

(샘플 태그 - 각 입력 필드를 고유하게하기 위해 I는 (새로운 제품을 추가하는 경우) 서로 다른 각 입력 이름값하게 작은 JS 조각을 첨가과 같이 실행중인 JS의)

이 방법은 주문 단계에서 가격과 설정을 업데이트하는 데 유용하지만 데이터를 제출할 때 다른 제품을 처리하는 방법이 확실하지 않습니다. 다른 이름. 이 아이디어, 방향에 대한 더 나은 접근 방법이 있습니까? 폼 데이터

unitPrice=6900&unitPrice=6900&body%5B%5D=White%20Ash&details%5B%5D=Stainless%20steel&topShelf%5B%5D=Wood&firstName=&lastName=&email=&phone=&address=&city=&zip=&country=&firstName2=&lastName2=&email2=&phone2=&address2=&city2=&zip2=&country2=&totalPrice=13800 

Answer 1

그 작업을 수행하는 방법에 대한 전체 코드를 제공하지 않을거야하지만 설명은 매우 충분하다. 당신이하고 싶은 것은 제출하기 전에 서버에 보내지는 데이터를 수정하는 것입니다. 각 필드에 대해 4 개의 배열을 만들고 각 데이터로 클라이언트 측에서 초기화 할 수 있습니다 (주 : 순서를 유지하기 위해 빈 값 포함). 그런 다음 모든 배열을 POST 필드로 보냅니다. 이것은 AJAX 쿼리를 사용하여 게시물을 처리 할 수 ​​있습니다. 서버 측에서 각 배열을 개별적으로 반복 할 수 있습니다. 이것은 POST 변수가 서버에 설정되어있는 경우 POST 변수의 양을 줄이는 답 중 하나 일뿐입니다 (어쩌면 64 이상일 수 있으며 사용자가 그 이상으로 넘어갈 수 있습니다).

희망이 도움이됩니다. 만약 당신이 코드 버전의 코멘트를 원한다면 나는 그것에 더 많은 시간을 할애 할 것이다.

Answer 2

1)의

예 아마 자바 스크립트 대신 필드를 만들 PHP 사용하기 쉽다.

2) 루프를 사용하여 이름을 살펴보고이를 저장하십시오. 배열에 :

unitPrice = []; //create array 
for($i = 0; $i < 10; $i++) 
{ 
    array_push(unitPrice,$_GET['unitPrice'.$i]); //push value into array 
} 

Answer 3

"unitPrice '+"i "대신 unitPrice []와 같은 양식 필드 이름에 배열을 사용해야합니다. 그런 다음 배열로 PHP의 양식 필드를 반복 할 수 있습니다. 예를 들어 $unitPrice = $_POST['unitPrice']은 foreach을 사용하여 반복 할 수있는 단가의 배열을 제공합니다. 말이 돼?