Solution 1 :

With bootstrap just add required to the select:

<select class="form-control langselect" aria-label="Language Translate Widget" id="country" style="display: none" required>
    <option value="">Select Language</option>
    <option value="English">English</option>
    <option value="Afrikaans">Afrikaans</option>
    <option value="Albanian">Albanian</option>
    <option value="Amharic">Amharic</option>
    <option value="Arabic">Arabic</option>
</select>

Edit

Change the buttons onclick to onsubmit:

<button style="margin-top: -5%" background-color="#357ae8" type="button" class="btn btn-success" data-toggle="modal" data-target="#exampleModal" data-whatever="@getbootstrap" onsubmit="lang1()">Save to Database</button>

Solution 2 :

Just recommending to rewrite this: <option value="">Select Language</option>
to this: <option selected disabled>Select Language</option>

When user clicks on the next button check if the select’s value length is 0 and return it.

Problem :

I have a form (bootstrap) in the script and need it if the user does not select the language and the value “” is blank to display the alert message and that he had to choose a language to proceed on the next step.
(as you can see the empty value in the form: value” ” represent “Select Language”)

I am using that form for google widget tool for translation, and when the visitor dont click anything and proceed to save file into the database , in the database I get value: “Select language” , I need that they pick one of the languages from the dropdown menu.

This is the form code:

<div class="form-group">
  <label for="recipient-name" class="col-form-label">Language:</label>
  <input type="text" class="form-control langinput" id="country" value="" readonly>
  <select class="form-control langselect" aria-label="Language Translate Widget" id="country" style="display: none">
    <option value="">Select Language</option>
    <option value="English">English</option>
    <option value="Afrikaans">Afrikaans</option>
    <option value="Albanian">Albanian</option>
    <option value="Amharic">Amharic</option>
    <option value="Arabic">Arabic</option>

here is the button code for saving files into the database:

<button style="margin-top: -5%" background-color="#357ae8" type="button" class="btn btn-success" data-toggle="modal" data-target="#exampleModal" data-whatever="@getbootstrap" onclick="lang1()">Save to Database</button>

lang1 Function:

        var langPath = $("select.goog-te-combo option:selected").text();
        /*document.getElementById("country").options[document.getElementById("country").selectedIndex].text = langPath;
        document.getElementById("country").options[document.getElementById("country").selectedIndex].value = langPath;*/
        document.getElementById("country").value = langPath;
        //$(".langinput").value = langPath;
        //$('input[type="text"][class="langinput"]').prop("value", "langPath");
        //$('.langinput').text(langPath);
        $('.langinput').attr('value', langPath);
        //$(".langinput").display = "inline";

    }
    /*function stoppedTyping(){
        if($('#subtitle').val().length > 1 && $('#country').val().length >0 ) {
            document.getElementById('submit_button').disabled = false;
        } else {
            document.getElementById('submit_button').disabled = true;
        }
    }
    function stoppedSelect(){
        if($('#subtitle').val().length > 1 && $('#country').val().length >0 ) {
            document.getElementById('submit_button').disabled = false;
        } else {
            document.getElementById('submit_button').disabled = true;
        }
    }*/

Comments

Comment posted by stackoverflow.com/questions/19640616/…

Possible duplicate of

Comment posted by GPS Lokator

It is not a duplicate and it has nothing to do with the question you referred to my question. Please read to the end before sentencing!

Comment posted by Natixco

Actually it’s the same.

Comment posted by Natixco

I don’t get it why it’s not working for you. Can you insert the lang1 function code?

Comment posted by GPS Lokator

Can you please write the code that you think it will work my friend and I will try to implement it

Comment posted by Andy Cutting

Try changing the buttons onclick=”lang1()” to onsubmit=”lang1()”

Comment posted by ibb.co/g6myZSw

I tried that but then it saves files without empty Language value, check the image below:

Comment posted by GPS Lokator

Does not work my friend, I am using that form for google widget tool for translation, and when the visitor dont click anything and proceed to save file into the database , in the database I get value: “Select language” , I need that they pick one of the languages from the dropdown menu.

Comment posted by Natixco

Don’t let the user to save the file until they don’t select a language. I guess there is a button for saving, so check the value in the function that it calls.

Comment posted by GPS Lokator

Ok please my friend I updated question , please take a look.

By