1
This is the language select box.

<select name="lang" id="lang" browser="Indicated by the browser">
<option value="en">English</option>
<option value="fr">French</option>
<option value="ch">Chinese</option>
<option value="sp">Spain</option>`enter code here`
</select>

This is script i have written.

<script type="text/javascript">


    jQuery(document).ready(function() {

        loadBundles('en');
        jQuery('#lang').change(function() {
            var selection = jQuery('#lang option:selected').val();
            loadBundles(selection != 'browser' ? selection : null);
            jQuery('#langBrowser').empty();
            if(selection == 'browser')  {                       jQuery('#langBrowser').text('('+jQuery.i18n.browserLang()+')');
            }
        });


    });

    function loadBundles(lang) {
        jQuery.i18n.properties({
            name:'Messages', 
            path:'bundle/', 
            mode:'both',
            language:lang, 
            callback: function() {
                updateExamples();
            }
        });
    }

    function updateExamples() {
        var ex1 = 'Firstname';
        var ex2 = 'Lastname';
        var ex3 = 'Youremail';
        var ex4 = 'Reenteremail';
        var ex5 = 'Newpassword';
        var ex6 = 'Dateofbirth';
        var ex7 = 'Signup';
        var ex8 = 'Itsfreeandalwayswillbe';
        var ex9 = 'Birthlabel';
        var ex10 = 'Termslabel';
        var ex11 = 'Summarylabel';
        var ex12 = 'PersonalLabel';
        var ex13 = 'Interestlabel';
        var ex14 = 'Addlabel';
        var ex15 = 'Editlabel';
        var ex16 = 'Deletelabel';
        var spreadsheet_label = 'Spreadsheetlabel';
        var invite_google_label = 'Invitegooglelabel';
        var invite_facebook_label = 'Invitefacebooklabel';
        var upload_label = 'Uploadlabel';
        var subBut='Submit';
        var dialogTitle = 'DTitle';


        jQuery("#first_name_label").text(eval(ex1));
        jQuery("#first_name_label1").text(eval(ex1));
        jQuery("#last_name_label").text(eval(ex2));
        jQuery("#last_name_label1").text(eval(ex2));
        jQuery("#email_label").text(eval(ex3));
        jQuery("#email_label1").text(eval(ex3));
        jQuery("#reenter_email_label").text(eval(ex4));
        jQuery("#new_password_label").text(eval(ex5));
        jQuery("#date_of_birth_label").text(eval(ex6));
        jQuery("#date_of_birth_label1").text(eval(ex6));
        jQuery("#sign_up").text(eval(ex7));
        jQuery("#label1").text(eval(ex8));
        jQuery("#button").val(eval(ex7));
        jQuery("#birth_label").text(eval(ex9));
        jQuery("#terms_label").text(eval(ex10));
        jQuery("#summary_label").text(eval(ex11));
        jQuery("#personal_label").text(eval(ex12));
        jQuery("#interest_label").text(eval(ex13));
        jQuery("#add_label").text(eval(ex14));
        jQuery("#edit_label").text(eval(ex15));
        jQuery("#delete_label").text(eval(ex16));

        jQuery("#spreadsheet_label").text(eval(spreadsheet_label));
        jQuery("#invite_google_label").text(eval(invite_google_label));
        jQuery("#invite_facebook_label").text(eval(invite_facebook_label));
        jQuery("#upload_label").val(eval(upload_label));


        jQuery("#submit_button").val(eval(subBut));
        jQuery("#ui-dialog-title-dialog").text(eval(dialogTitle));


    }
  </script>

  Everything is working fine for the labels. But in the case of dynamic drop down i     got    problem. How to localize the dynamic drop down data when the user selected the   language.
 The data in the drop down is coming from the database.



 I have a language select drop down box, after selecting one language from dropdown list am able to change the text filed names and all other text in the language that is selected.

同时我有另一个下拉列表,因为数据是从数据库中动态生成的。在用户从下拉列表中选择语言后,我还必须更改此下拉列表中的数据。如果你有任何想法,请给我建议。

谢谢你。

4

3 回答 3

0

你可以这样做:

<select name='lang'>
<option value='eng'>Eng</option>
<option value='french'>French</option>

</select>

<!-- below div is another div whose data changes as per the language selected -->
<div id="another_div"></div>​

JS:

$("select[name='lang']").live({
change: function(e){
    var selected_lang = $("select[name='lang'] option:selected").html();

    data = {}
    data['selected_lang'] = selected_lang;
    $.ajax({
        url: "required url",
        data: data,
        success: function(res){
           $("#another_div").text(res); // if result is a direct text sent from server
            // or
            $("#another_div").text(res.content); //if result is an object with the required content present in the key 'content'
        },
        error: function(err){
            alert("error occured");                 
        }

    });        


}
 });​
于 2012-10-31T12:27:35.197 回答
0

我会使用许多级联 jQuery 下拉菜单之一:

http://www.ryanmwright.com/2010/10/13/cascading-drop-down-in-jquery/

于 2012-10-31T12:28:14.350 回答
0

我建议你使用 ajax 来解决这个问题。

您可以bind先使用 ajax 下拉列表,然后使用从后端获取的数据填充第二个下拉列表。

于 2012-10-31T12:07:31.543 回答