숨겨진 입력 필드를 추가하여 모델에 바인딩하십시오.

Question

타사 파일 업 로더 (Backload)를 사용하여 이미지 업로드 & 업로드 된 이미지 이름을 가져 오는 JavaScript를 사용하고 있습니다. 해당 이미지 이름 목록을 MVC 모델에 바인딩하고 싶습니다. . 내 요구 사항은 폼을 제출할 때 숨겨진 입력을 동적으로 생성하는 것입니다. 알아, 나는 루프와 함께 순차 바인딩을 사용해야한다. 누구든지 올바른 구문을 사용하여이를 달성하는 방법을 알려줄 수 있습니까? 이 비슷한을해야이

for (int i= 0; i< noOfImages; i++) 
{ 
    <input type="hidden" name="Model.Images[i].Name" value=file.name /> 
} 

(나는 이것을 위해 아약스 솔루션을 원하지 않는 점에 유의하시기 바랍니다 나에게 내 면도기보기에서 사용하는 코드를 보여주십시오 또는 다른 더 나은 솔루션이 있다면 알려 주시기 바랍니다).감사.

public class ItemModel 
{ 
    public int ID { get; set; } 
    public string Name { get; set; }  
    public virtual ICollection<ImageModel> Images { get; set; } 
} 

public class ImageModel 
{ 
    public int ID { get; set; } 
    public string Name { get; set; }  
    public virtual ItemModel Items { get; set; } 
} 

#ItemCreate 양식의 제출 버튼을 클릭하면 다음 JavaScript 코드를 사용하여 업로드 된 파일 이름의 값을 가져오고 숨겨진 입력을 생성합니다.

$('#ImageUplodedtable input[name="ImageName"]').each(function() { 
    $('#ItemCreateForm').append('<input name="ImageName" value="' + this.value + '"/>'); 

다음 질문을 제 질문에 추가하고 있습니다. 나는 작은 따옴표와 두 개의 더하기 기호 [ '+ i +']를 놓쳤다. 이제는 잘 동작한다.

$('#ImageUplodedtable input[name="ImageName"]').each(function() { 
    for (int i= 0; i< noOfImages; i++) 
{ 
    <input type="hidden" name="Images[+'i'+].Name" value="' + this.value + '" /> 
} 

여기서 for 루프를 사용할 수 없습니다. 누구든지 Uploded 테이블의 모든 이미지 이름을 가져 오는 방법을 제안 할 수 있습니까?

Answer 1

상단의 for 루프에서 올바르게했는데, 일단 JavaScript 부분에 도달하면 이름이 잘못되었습니다. 입력의 이름을 첫 번째 for 루프와 동일한 스타일로 유지하면 괜찮습니다. 즉 Images[N].Name입니다. N은 컬렉션의 항목 색인입니다.

Answer 2

마지막으로이 함수를 사용하여 숨김 파일을 작성하기로 결정했습니다. 나는 이것이 나 같은 초보자를 미래에 도울 수 있기를 바란다.

function CretaeHiddenFields(){ 
var uploadedImages = $('#ImageUplodedtable input[name="ImageName"]') ; 
var divArea = $(#CreateInputDiv); 
    for (var i = 0; i < uploadedImages .length; i++) { 
     var imageName = document.createElement("input");   
     imageName.type = "hidden"; 
     imageName.name = "Images[" + i + "].Name"; 
     imageName.value = uploadedImage[i].value; // value of #ImageUplodedtable ImageNameinputs 
     formCreteItm.append(imageName); 

    } 

}