2014-09-22 3 views
3

JS Fiddle은 양식 값을 제출할 예정이지만 제출 버튼을 대신 JSON에 직렬화하고 저장 대화 상자를 열어주세요. 오프라인으로 작업해야하므로 HTML과 JS 만 작동해야합니다.저장 대화 상자를 사용하여 양식 값을 JSON에 저장하는 방법은 무엇입니까?

질문

는 jQuery 플러그인이이가 할 수있는 존재합니까? 그렇지 않다면 어떤 JS 함수를 조사해야합니까?

JS

$("#myform").dform({ 
    "action" : "index.html", 
    "method" : "get", 
    "html" : 
    [ 
     { 
      "type" : "p", 
      "html" : "You must login" 
     }, 
     { 
      "name" : "username", 
      "id" : "txt-username", 
      "caption" : "Username", 
      "type" : "text", 
      "placeholder" : "E.g. [email protected]" 
     }, 
     { 
      "name" : "password", 
      "caption" : "Password", 
      "type" : "password" 
     }, 
     { 
      "type" : "submit", 
      "value" : "Login" 
     } 
    ] 
}); 

HTML

<form id="myform"></form> 

CSS

body { 
    font-family: sans-serif; 
    padding: 10px; 
} 

label, input { 
    display: block; 
    margin-top: 10px; 
} 
+0

당신이 dform 설명서를 확인하거나 정확히 관련되지 표준 –

+0

에 .serialize()를 사용하지만, 어디에해야

$("#myform").on('submit', function(e){ // prevent default submit action e.preventDefault(); var serialized = $(this).serializeArray(), obj = {}; // build key-values $.each(serialized, function(){ obj [this.name] = this.value; }); // and the json string var json = JSON.stringify(obj); console.log(json); // send your data here... }); 

대화 상자가 광범위한 주제는 다음과 같습니다 모자는 쉽게 JSON을 구축 할 수 있도록 오프라인 일 때 양식을 제출 하시겠습니까? – Teemu

답변

4

의 jQuery t에서 serializeArray()있다 ;)

+0

저장 대화 상자 란 OS가 제공하는 표준을 의미합니다. 예 : 다운로드 링크를 클릭하면 –

+1

저장할 파일을 생성하는 서버가 없으면 좀 더 복잡해집니다. [Blob'] (https://developer.mozilla.org/en/docs/Web/API/Blob)을 만들어야하고 데이터를 추가하면 URL이 생성됩니다. 이게 네가 원하는거야? json 파일에 사용자 이름과 암호를 저장하는 것이 약간 이상한 것 같습니다. –

+0

그래, 문제가 나타납니다 ... 사용자 이름/암호는 예제 일뿐입니다. 사람들이 종이에 사진을 몇 장 찍을 수있는 키오스크를 만들고 싶습니다. 브라우저에 글을 쓴 다음 그 결과를 파일에 저장해야합니다. 컴퓨터에는 Firefox/Chrome이 있으며 인터넷에 연결되어 있지 않습니다. –

관련 문제