Использование файлов cookie для заполнения веб-формы JavaScript

#javascript #html #forms #cookies

#javascript #HTML #формы #файлы cookie

Вопрос:

У меня есть ряд форм Javascript, которые мне нужно разработать для веб-приложения, но я использую Simfatic для тяжелой работы, и я не очень много знаю об этих технологиях. Я пытался использовать как php, так и javascript для добавления и вызова файлов cookie для заполнения части номера телефона в этой небольшой форме, но я даже не могу заставить его создать файл cookie, не говоря уже о том, чтобы вызвать его обратно, чтобы заполнить эту часть формы при повторном посещении страницы. Я бы хотел, чтобы файл cookie был постоянным во всех формах серии, но сейчас я соглашусь на то, чтобы для начала написать файл cookie. Интересно, может ли кто-нибудь указать мне, где я нахожусь. Спасибо, вот мой код.

 <html>
    <head>
        <title>
        FCT Trip Tracker
        </title>
<script type="text/javascript">
    var today = new Date();
    var expiry = new Date(today.getTime()   30 * 24 * 3600 * 1000);
    function setCookie(name, value)
    {
    document.cookie=name   "="   escape(value)   "; path =/; expires="   expiry.toGMTString();
    }
</script>
<script type="text/javascript>
        function writeCookie() {
            if( document.fct1b.phoneno.value == "" ){
                alert("Enter some value!");
                return;
            }
            cookievalue= escape(document.fct1b.phoneno.value)   ";";
            document.cookie="phoneno="   cookievalue );
        }
</script>
<script type="text/javascript">
        if(phoneno = getCookie("phoneno")) document.fct1b.phoneno.value = phoneno;
</script>
    </head>
<body>
    <script src='http://location.jgi.local/1b/scripts/jquery-1.7.2.min.js' type='text/javascript'></script>
<script src='http://location.jgi.local/1b/scripts/jquery.sim.utils.js' type='text/javascript'></script>
<script src='http://location.jgi.local/1b/scripts/sfm_validatorv7.js' type='text/javascript'></script>
<link rel='stylesheet' type='text/css' href='http://location.jgi.local/1b/style/fct1b.css'>
<form id='fct1b' class='sfm_form' novalidate='novalidate' method='post' action='http://location.jgi.local/1b/fct1b.php' accept-charset='UTF-8'>
   <div id='fct1b_errorloc' class='error_strings' style='text-align:left'></div>
   <div id='fct1b_outer_div_p1' class='form_outer_div'>
      <div style='position:relative' id='fct1b_inner_div'>
         <input type='hidden' name='sfm_form_submitted' value='yes'>
         <div id='label1_container' class='sfm_form_label'>
            <label id='label1' for='phoneno'>Phone # :</label>
         </div>
         <div id='phoneno_container' class='sfm_element_container'>
            <input type='text' name='phoneno' id='phoneno' class='sfm_textbox_common sfm_textbox' size='20' value>
         </div>
         <div id='label_container' class='sfm_form_label'>
            <label id='label' for='trailerno'>Trailer # :</label>
         </div>
         <div id='trailerno_container' class='sfm_element_container'>
            <input type='text' name='trailerno' id='trailerno' class='sfm_textbox_common sfm_textbox' size='20' value>
         </div>
         <div id='Submit_container' class='loading_div sfm_element_container'>
            <input type='submit' name='Submit' value='Submit' id='Submit' onclick="writeCookie();"/>
         </div>
      </div>
   </div>
</form>
<script type='text/javascript'>
$(function()
{
   sfm_show_loading_on_formsubmit('fct1b','Submit');
});
</script>
<script type='text/javascript'>
var fct1bValidator = new Validator("fct1b");
fct1bValidator.addValidation("phoneno",{required:true,message:"Please fill in phoneno"} );
fct1bValidator.addValidation("trailerno",{required:true,message:"Please fill in trailerno"} );
</script>
    </body>
</html>
 

Ответ №1:

Во-первых, причина, по которой значение входных данных не считывается при создании файла cookie, заключается в том, что JavaScript не может найти элемент формы.

Есть два способа решить эту проблему:

  1. Добавьте следующий атрибут к <form> тегу: name="fct1b"

    Вы можете получить доступ к элементам только document.fct1b.phoneno в том случае, если элементы, к которым вы пытаетесь получить доступ, имеют name атрибут для них.

  2. Если у элемента нет name атрибута, вы можете использовать функции getElementById или querySelector для извлечения элемента DOM. Тогда вам придется написать его как таковой: document.getElementById('fct1b').phoneno.value