Bootstrap表单助手没有选择完整的国家/地区名称 [英] Bootstrap form helper not picking complete country name

查看:96
本文介绍了Bootstrap表单助手没有选择完整的国家/地区名称的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我已添加bootstrap表单助手以列出国家及其状态。
最初,它根本没有取得国名。但我设法用jQuery检索国家名称,但它没有显示完整的名称。

I have added bootstrap form helper to list down the countries and their states. Initially, It was not picking up the country name at all. But I managed to retrieve the country name with jQuery but it is not showing the complete name.

以下是表格的完整代码:

Here is the complete code of the form:

<div class="signup-form">
    <div class="container">
        <div class="row">
            <div class="col-sm-3"></div> <!-- blank column -->
            <div class="col-sm-6">
                <div class="panel panel-info">
                    <div class="panel-heading">
                        <h3 class="panel-title">Registration Form</h3>
                    </div>
                    <div class="panel-body">

                        <form action="signup.php" method="post" class="form-horizontal" role="form">
                            <div class="form-group">  <!-- First Name Field --> 
                                <label class="col-sm-4 ">Name</label>
                                <div class="col-sm-8">
                                    <input class="form-control" name="name" type="text" placeholder="Ener your name">
                                </div>
                            </div>                          

                            <div class="form-group">  <!-- Surname Field --> 
                                <label class="col-sm-4">Surname</label>
                                <div class="col-sm-8">
                                    <input class="form-control" name="surname" type="text" placeholder="Ener your surname ">
                                </div>
                            </div>                      

                            <div class="form-group">  <!-- Username --> 
                                <label class="col-sm-4">Username</label>
                                <div class="col-sm-8">
                                    <input class="form-control" name="username" type="text" placeholder="Enter your lowercase username ">
                                </div>
                            </div>                      

                            <div class="form-group">  <!-- Email Field --> 
                                <label class="col-sm-4">Email</label>
                                <div class="col-sm-8">
                                    <input class="form-control" id="email" name='email' type="email" placeholder="Ener your valid email ">
                                </div>
                            </div>                      

                            <div class="form-group">  <!-- Password Field --> 
                                <label class="col-sm-4">Password</label>
                                <div class="col-sm-8">
                                    <input class="form-control" type="password" name="password" placeholder="Ener your password (at least 6 digits) ">
                                </div>
                            </div>  

                            <div class="form-group">  <!-- Confirm Password Field --> 
                                <label class="col-sm-4">Confirm Password</label>
                                <div class="col-sm-8">
                                    <input class="form-control" type="password" name="confirm_password" placeholder="Retype your password ">
                                </div>
                            </div>                      

                            <div class="form-group">  <!-- Sex Field --> 
                                <label class="col-sm-4">Sex</label>
                                <div class="col-sm-8">
                                    <select name="sex">
                                        <option>Male</option>
                                        <option>Female</option>
                                    </select>
                                </div>
                            </div>  

                            <div class="form-group">  <!-- Phone Number Field --> 
                                <label class="col-sm-4">Phone No</label>
                                <div class="col-sm-8">
                                    <input class="form-control" type="text" name="phone_no" placeholder="Enter your phone number">
                                </div>
                            </div>  

                            <div class="form-group">  <!-- Date of birth Field --> 
                                <label class="col-sm-4">Date of Birth</label>
                                <div class="col-sm-8">
                                    <input class="form-control" id="dob" type="text" name="dob" placeholder="Enter your Date of birth">
                                </div>
                            </div>  

                            <div class="form-group">  <!-- Nationality Field --> 
                                <label class="col-sm-4">Nationality</label>
                                <div id="country_name" class="col-sm-8 bfh-selectbox bfh-countries" data-country="NG" data-flags="true" name="country">
                                    <input type="hidden" id="country" name="country" value="">                              
                                </div>
                            </div>  

                            <div class="form-group">  <!-- State of Residence Field --> 
                                <label class="col-sm-4">State of Residence </label>
                                <div class="col-sm-8 bfh-selectbox bfh-states" data-country="country_name">
                                    <input type="hidden" id="state" name="state" value="">
                                </div>
                            </div>  

                            <div class="form-group">  <!-- Sign Up Button -->   
                            <div class="col-sm-4"></div> <!-- Blank for space -->
                            <div class="col-sm-8 signup-button">
                                <button type="submit" class="btn btn-default" action="signup.php">Sign Up</button>
                            </div>
                        </form>
                    </div>
                </div>

            </div> <!-- End of main colum -->
            <div class="col-sm-3"></div> <!-- blank column -->
        </div> <!-- End of row -->
    </div> <!-- End of container -->
</div> <!-- End of sign up -->

这是相应的jquery代码:

Here is the corresponding jquery code:

    $(function(){
     $("#dob").datepicker();
});


$('document').ready(function(){
  $("#dob").datepicker();

  $(document).find(".bfh-countries input[type=hidden]").attr("name","country");
  $(document).find(".bfh-states input[type=hidden]").attr("name","state");
});

我试着查看js文件。我认为它使用了关联的javascript数组,例如:

I tried to look into js file. I think it uses associate javascript array somthing like:

    var bootFHCountriesList = {
  'AF': 'Afghanistan',
  'AL': 'Albania',
  'DZ': 'Algeria',
  'AS': 'American Samoa',
  'AD': 'Andorra',
  'AO': 'Angola',
  'AI': 'Anguilla',
  'AQ': 'Antarctica',
  'AG': 'Antigua and Barbuda',
  'AR': 'Argentina',
  'AM': 'Armenia',
  'AW': 'Aruba',
  'AU': 'Australia',
  'AT': 'Austria',
  'AZ': 'Azerbaijan',
  'BH': 'Bahrain'};

我相信有办法通过提供短名称来检索完整名称。但我不知道该怎么做。

I believe there is way to retrieve the complete name by providing the the short name. But I do not know how to do so.

我想将国家名称和州名存储在数据库中。

I want to store the country name and state name in the database.

谢谢

推荐答案

对不起,如果它迟到了,试试这个;

Sorry if its late but try this;

<select id="countries_phone1" class="form-control bfh-countries" data-country="GR"></select>

您应该将国家/地区代码提供给 data 属性。

You should give country code to data attribute.

这篇关于Bootstrap表单助手没有选择完整的国家/地区名称的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆