2013-02-07 2 views
0

사용자를 편집 할 수있는 양식이 있습니다. 이 양식은 팝업으로 표시됩니다 (저는 colorbox 플러그인을 사용하고 있습니다). 저장을 클릭하면 팝업이 닫히는 대신 팝업 페이지에 머물러있어 "성공적으로 저장된 정보"와 같은 텍스트를 표시 할 수 있습니다. 지금은 저장을 클릭 할 때마다 팝업 폼이 닫히고 이전 페이지로 돌아갑니다. 내 팝업을 저축 상태로 유지할 수 있습니까? 어떤 도움을저장시 팝업 상태를 유지 하시겠습니까? (컬러 박스)

VIEW를 감사

$('.openDialog').colorbox({ 
        transition: "elastic", 
        width: "40%", height: "80%" 
       }); 

CONTROLLER

<input type="submit" value="Save" id="btnSave" class="openDialog"/> 

제출하지만 팝업 컨트롤러로 이동하지 않습니다 아약스 양식을 사용하여 시도 VIEW는, 내가 추가

[HttpPost] 
     public ActionResult Edit(UserViewModel vm) 
      { 
       Save(vm); 
       return View(vm); 
      } 

페이지 및 웹 설정에 눈에 잘 띄지 않는 스크립트와 jquery 1.8 여전히 좋지 않음

@using (Ajax.BeginForm("Edit", "User", 
      new AjaxOptions 
      { 
       HttpMethod = "POST", 
       InsertionMode = InsertionMode.Replace 
      })) 
+1

컨트롤러에 아약스 콜백을 사용하십시오 ... – Garry

답변

1

iframe 속성이 true로 설정된 colorbox를 사용하기 만하면됩니다. 양식을 처음 표시 할 때 매개 변수 iframe: true을 추가하십시오.

가 클릭에 다시 $.colorbox를 호출하지 마십시오, 그래서보기에서 입력 태그 그냥해야한다 :

<input type="submit" value="Save" id="btnSave" /> 

당신이 제출 버튼을 클릭하면, 형태가 발생 제출하고 결과에 반환됩니다 같은 colorbox iframe. Colorbox는 내부적으로 AJAX를 사용하며이 모든 것을 처리하기 위해 iframe을 만들면 아무 것도 쉬울 수 없습니다.

이 접근 방식을 보려면 http://www.jacklmoore.com/colorbox/example1/을보고 "외부 웹 페이지 (iFrame)"라는 iFrame 예를보고 위키 검색 페이지를 가져온 다음 동일한 색상 상자 내에서 양식을 제출하십시오.

+0

감사! 이것은 colorbox를위한 좋은 기능입니다. 답변으로 답변 –

1

양식이 제출되고 있습니다. 즉, 동일한 페이지가 될 가능성이 높으므로 페이지가 다시로드되지만 제출 된 양식 데이터가 표시됩니다.

원하는대로하려면 양식을 아약스를 통해 제출해야합니다. 이렇게하면 양식이 자바 스크립트를 통해 제출되고 페이지를 다시로드하지 않게됩니다.

이 경우 컨트롤러가보기를 반환하는 대신 전송 성공 여부 및 페이지를 업데이트해야하는 항목을 알려주는 상태 메시지가 표시됩니다.

+0

ajax.beginform을 사용하기 위해 양식을 부분적으로 만들 필요가 있습니까? –

관련 문제