尝试从local.storage设置<option>的默认值

时间：2016-11-29 13:59:05

标签： javascript php jquery html ajax

我目前正在创建一个带登录系统的API，我希望我的用户能够更新他们的用户信息。 我有一个注册页面，他们填写了一些表格，然后我用AJAX POST发布到我的数据库。 我几乎复制了确切的HTML和jQuery.AJAX的编辑用户页面，它的工作原理！ ：d 现在我想获取数据库中已存在的数据，并填写表格/输入和编辑用户页面上的下拉菜单。 我可以通过创建一个包含localstorage.get（'user'）的变量来做到这一点。-DATA-I-WANT-TO-FILL-IN; 那么我正在制作一个if或else条件语句，如下所示。

这是我的HTML视图的jquery函数;编辑用户页面。

function editUserPage() {

var user = store.get('user');

var first_name = store.get('user').first_name;
var last_name = store.get('user').last_name;
var email = store.get('user').email;
var gender = store.get('user').gender;
var dateofbirth = store.get('user').dateofbirth;
var phone_number = store.get('user').phone_number;
var address = store.get('user').address;
var city = store.get('user').city;
var zipcode = store.get('user').zipcode;
var country = store.get('user').country;
var nationality = store.get('user').nationality;
var speak_danish = store.get('user').speak_danish;
var colleague = store.get('user').colleague;
var task = store.get('user').task;
var genderSelected ='';
var danishSelected = '';
var countrySelected = '';

if(gender = '1') {
    genderSelected = 
    '<select id="gender" name="gender" placeholder="Gender">'
        +'<option value="" disabled selected>Gender</option>'
        +'<option value="1" selected>Female</option>'
        +'<option value="0">Male</option>'
    +'</select>';
}
else {
    genderSelected = 
    '<select id="gender" name="gender" placeholder="Gender">'
        +'<option value="" disabled selected>Gender</option>'
        +'<option value="1">Female</option>'
        +'<option value="0" selected>Male</option>'
    +'</select>';
}

if(speak_danish = '1') {
    danishSelected =
    '<select id="speak_danish" name="speak_danish">'
                +'<option value="danish" disabled selected>Speak and understand Danish</option>'
                +'<option value="1" selected>Yes</option>'
                +'<option value="0">No</option>'
    +'</select>';
} 
else {
    danishSelected =
    '<select id="speak_danish" name="speak_danish">'
        +'<option value="danish" disabled selected>Speak and understand Danish</option>'
        +'<option value="1">Yes</option>'
        +'<option value="0" selected>No</option>'
    +'</select>';
}


var html = 
'<div class="register-text container">'
        +'<h3>You are about to register as a volunteer for</h3>'
        +'<img src="' + RESS +'img/tinderbox_date.svg">'
    +'</div>'
    +'<div class="register-input container">'
            +'<br>'
            +'<label for="email">Email Address</label>'
            +'<br>'
            +'<input id="email" type="email" name="email" placeholder="Email" value="' + email + '">'
            +'<br>'
            +'<label for="password">Password</label>'
            +'<br>' 
            +'<input id="password" type="password" name="password" placeholder="Password">'
            +'<br>'
            +'<label for="first_name">First Name</label>'
            +'<br>'
            +'<input id="first_name" type="text" name="first_name" placeholder="First Name" value="' + first_name + '">'
            +'<br>'
            +'<label for="last_name">Last Name</label>'
            +'<br>'
            +'<input id="last_name" type="text" name="last_name" placeholder="Last Name" value="' + last_name + '">'
            +'<br>'
            +'<label for="gender">Gender</label>'
            +'<br>'
            +'<div class="dropdown-style">'
            +   genderSelected
            +'</div>'
            +'<br>'
            +'<label for="dateofbirth">Date of Birth</label>'
            +'<br>'
            +'<input id="dateofbirth" placeholder="Date of Birth" type="date" name="dateofbirth" value="' + dateofbirth + '">'
            +'<br>'
            +'<label for="nationality">Nationality</label>'
            +'<br>'
            +'<div class="dropdown-style">'
            +'<select id="nationality" name="nationality" >'
                +'<option value="nationality" disabled selected>Nationality</option>'
                +'<option value="Danish">Danish</option>'
                +'<option value="German">German</option>'
                +'<option value="norwegian">Norwegian</option>'
            +'</select>'
            +'</div>'
            +'<br>'
            +'<label for="upload-image">Upload Image</label>'
            +'<br>'

            +'<div class="upload-image">'
                +'<img src="images/picture.svg">'
                +'<p>Upload image</p>'
            +'</div>'
            +'<br>'
            +'<label for="phonenumber">Phonenumber</label>'
            +'<br>'
            +'<input id="phonenumber" type="text" name="phonenumber" placeholder="Phonenumber" value="' + phone_number + '">'
            +'<br>'
            +'<label for="address">Address</label>'
            +'<br>'
            +'<input id="address" type="text" name="address" placeholder="Address">'
            +'<br>'
            +'<label for="countryId">Country</label>'
            +'<br>'
            +'<div class="dropdown-style">'
            + '<select name="country" class="countries" id="countryId">'
            + '<option value="" disabled>Select Country</option>'
            + '</select>'
            +'</div>'
            + '<script src="http://lab.iamrohit.in/js/location.js"></script>'
            +'<br>'
            +'<label for="zipcode">ZIP</label>'
            +'<br>'
            +'<input id="zipcode" type="text" name="zipcode" placeholder="Zip code" value="' + zipcode + '">'
            +'<br>'
            +'<label for="city">City</label>'
            +'<br>'
            +'<input id="city" input="city" type="text" name="city" placeholder="City" value="' + city + '">'
            +'<br>'
            +'<label for="speak_danish">Speak and understand Danish</label>'
            +'<br>'
            +'<div class="dropdown-style">'
            + danishSelected
            +'</div>'
            +'<br>'
            +'<label for="task">Preferred work tasks</label>'
            +'<br>'
            +'<div class="dropdown-style">'
            +'<select id="task" name="task">'
                +'<option value="tasks" label disabled selected>Preferred work tasks</option>'
                +'<option value="fences">Building Fences</option>'
                +'<option value="bartender">Bartender</option>'
                +'<option value="it-work">IT Work</option>'
            +'</select>'
            +'</div>'
            +'<br>'
            +'<label for="colleague">Preferred Colleague</label>'
            +'<br>'
            +'<input id="colleague" type="text" name="colleague" placeholder="I like to work with (name)" value="' + colleague + '">'
            +'<button class="link-register-user" type="submit" value="REGISTER">Register</button>'  
    +'</div>';

jQuery('#main').html(html);

就像我写的那样，用户输入新信息后用来更新的AJAX调用也与我的注册完全相同，但POST是PUT / PATCH。 （让我知道我是否也应该这样做，但我不认为它是相关的，因为它有效并且不是这里的概率）

足够的介绍（我认为）。 现在我想要帮助的实际问题是，在我的下拉列表中，我想将值设置为他们在注册时第一次选择的值，因此我是我的数据库。现在我正在做： if（选择某个选项）{显示选择此选项的HTML} else（选择另一个选项）{显示选择其他选项的HTML} 但是当我有像Country这样的下拉列表时，我从外部jQuery脚本中获取所有可能的选项，       我不能为每个选项制作一个if（）{} elseif（）{} elseif（）{} elseif（）{}，当有超过200时:(

先谢谢你的帮助，顺便说一句，对于stackoverflow和编码来说还是比较新的，所以请耐心等待，让我知道我是否应该分享更多代码，让你了解它以帮助我out; =）

0 个答案:

没有答案
相关问题
最新问题