2008-10-29 5 views
5

웹 양식을 제출하고 사용자를 다른 페이지로 가져 가면 사용자가 양식을 다시 제출하기 위해 뒤로 버튼을 클릭하는 경우가 많습니다 양식은 내 경우에는 고급 검색입니다.뒤로 버튼에 대한 웹 양식 콘텐츠 유지 방법

사용자가 뒤로를 클릭 할 때 선택한 양식 옵션을 안정적으로 유지하려면 어떻게해야합니까? (즉, 양식을 다시 채우지 않고 처음부터 다시 시작할 필요가 없습니다.) 많은 양식 요소 중 하나만 변경하고 있습니까?)

세션 데이터 (쿠키 또는 서버 측)에 양식 옵션을 저장하는 경로를 내려야하거나 브라우저에서이를 처리 할 수있는 방법이 있습니까? 나를?

는 (환경 PHP/자바 스크립트 - 그리고이 사이트는 IE6 +와 Firefox2 +에서 작동한다) 내가 세션에 넣어 줄

답변

4

.
가장 신뢰할 수있을 것입니다. 곧 돌아 가지 않아도 검색 옵션이 계속 남아 있습니다. 쿠키를 쿠키에 넣는 것도 가능하지만 매우 작지 않은 이상 권장되지는 않습니다.

6

나는 당신이 브라우저의 자비에 있다고 믿는다. 다시 히트하면 브라우저가 서버에 콘텐츠를 요청하지 않고 캐시를 사용합니다 (거의 모든 브라우저에서 보았습니다). 따라서 서버 측은 아무 것도 없습니다.

결과 페이지의 onunload 이벤트 동안 검색 결과를 쿠키에 저장 한 다음 검색 페이지의 JavaScript에서 쿠키를 읽고 양식을 채우는 것과 같이 매우 복잡한 작업을 수행 할 수 있는지 궁금합니다. 이것은 단지 추측이며, 그것이 작동하는지 모르겠습니다.

+5

서버 측은 반드시 옵션 일 필요는 없습니다. JavaScript가 페이지에 대해 다시 실행되므로 Ajax 요청을 할 수 있습니다. –

+0

사실입니다. 나는 그것을 잊었다. –

2

문제는 브라우저가 캐시 된 버전의 페이지를 반환하고 서버에 다시 요청하지 않는다는 것입니다. 세션을 사용한다는 것은 의미가 없습니다.

그러나 AJAX를 사용하여 페이지의로드 이벤트에서 이전에 제출 된 양식의 세부 정보를로드 할 수 있습니다.

1

POST 후에 기본적으로 서버에 세션 변수 (제안 된대로 세션 변수)를 저장해야합니다. 또한로드 할 때 AJAX 호출을 발행하여 서버에서 데이터를 가져오고 (예 : JSON 형식) 양식 필드에 데이터를 채우기 위해 양식 페이지에 Javascript를 설정해야합니다.

예 jQuery 코드 :

$(document).ready(function() { 
    $.getJSON(
    "/getformdata.php", 
    function(data) { 
     $.each(data.items, function(i,item) { 
     $('#' + item.eid).val(item.val); 
     }); 
    }); 
}); 

귀하의 /getformdata.php이 같은 데이터를 반환 할 수는 : 세션에 대해 아직 저장 아무것도 없다면

{ 
    'items': [ 
    { 
     'eid': 'formfield1', 
     'val': 'John', 
    }, 
    { 
     'eid': 'formfield2', 
     'val': 'Doe', 
    } 
    ] 
} 

그것은 분명히 빈 배열을 반환합니다. 위의 코드는 거칠고 테스트되지 않았지만 기본적인 아이디어를 제공합니다.

오페라와 파이어 폭스의 최신 버전은 뒤로 돌아갈 때 양식 필드 내용을 보존합니다. JS 코드가이 코드를 덮어 쓰지 만 안전해야합니다.

0

다른 javascript 옵션 (javascript가없는 사용자에게는 좋지 않습니다)은 javascript를 통해 양식을 제출 한 다음 확인 페이지로 이동하거나 버튼을 메시지로 바꾸어 양식에 메시지를 표시하는 것입니다. 그렇게하면 "뒤로"가 가능하지 않습니다.

0

제출하기 전에 왜 값을 쿠키에 저장하지 않습니까?또한 타임 스탬프 나 토큰을 포함하여 채워진시기를 나타낼 수 있습니다. 그런 다음 페이지가로드되면 필드의 데이터를 쿠키로 채워야하는지 아니면 새로운 검색이기 때문에 비워 둘지 여부를 결정할 수 있습니다.

3

브라우저에 달려 있지만 대부분의 경우 아무 것도 할 필요가 없습니다.

IE, Firefox 등은 이전 페이지의 양식 내용을 기쁜 마음으로 기억하고 뒤로를 클릭하면 다시 표시됩니다. 작업을 중단하기 위해 아무 것도하지 않는 한 페이지를 no-cache로 만들거나 스크립트로 양식을 완전히 작성합니다.

(세션에서 물건을 두는 것은 같은 폼에 열려 두 개의 탭으로 브라우저를 혼동 할 가능성이있다. 그런 아무것도 할 때 매우주의해야합니다.)

+0

예외는 양식 작업이 https 페이지 인 경우입니다 (양식 위치가 https 일 수도 있습니다). –

0

또한 자바 스크립트에 의해 지역 모든 것을 할 수 있습니다. 따라서 검색 값이있는 쿠키를 저장하고 pageload에 쿠키가 있는지 확인하십시오. 다음과 같은 것 :

$('#formSubmitButton').click(function() { 
    var value = $('#searchbox').val(); 
    var days = 1; 
    var date = new Date(); 
    date.setTime(date.getTime()+(days*24*60*60*1000)); 
    var expires = "; expires="+date.toGMTString(); 
    document.cookie = "searchbox="+value+expires+"; path=/"; 
}); 

$(document).ready(function() { 
    var nameEQ = "searchbox="; 
    var ca = document.cookie.split(';'); 
    for(var i=0;i < ca.length;i++) { 
     var c = ca[i]; 
     while (c.charAt(0)==' ') c = c.substring(1,c.length); 
     if (c.indexOf(nameEQ) == 0) var valueC = c.substring(nameEQ.length,c.length); 
    } 
    $('#searchbox').val(valueC); 
}); 

테스트하지 않았지만 제대로 작동 할 것입니다. 이를 위해 jQuery가 필요하다. 내가 BTW 파이어 폭스와 IE 모두가 기본적으로이 동작이 그 말을해야 http://www.quirksmode.org/js/cookies.html

:에서

쿠키 기능이왔다.