1

I have a file XML. It's follow . I use Flask Framework Python to get query in search bar and value of current dropbox (e.g english or vietnamese). I use "POST" method get value when I enter or click "Search" button. But value of dropbox is null.

 <form class="input-group">

                 <div class="input-group-btn search-panel" id="menu1">
                        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                            <span>Language</span>
                        </button>
                        <ul name ="btnLanguage" class="dropdown-menu" role="menu">
                            <li><a>English</a></li>
                            <li><a>Vietnamese</a></li>
                        </ul>
                 </div>

                <input type="text" class="form-control" name="query" id ="query" placeholder="Search sentence...">
                <span class="input-group-btn">
                    <button id ="btnSearch" class="btn btn-success" type="submit">
                        <span class="glyphicon glyphicon-search" aria-hidden="true"></span>
                    </button>
                </span>
            </form>

How can you help me. Thank you

 @app.route("/search" , methods=["POST"])
 def search():
    print("True")
    # read the posted values from the UI
    _query = request.form['query']
    print(_query)
    _language = request.value['btnLanguage']
    print(_language)

and Json Method:

$(function(){
$('#btnSearch').click(function(){
    $.ajax({
        url: '/search',
        data: $('form').serialize(),
        type: 'POST',
        success: function(response){
            console.log(response);
        },
        error: function(error){
            console.log(error);
        }
    });
});

});

vallentin
  • 19,107
  • 6
  • 43
  • 68
hoang long
  • 35
  • 2

1 Answers1

0

It is because ul-li is not a regular form control (Checkout this link for available form control in html). So jquery will not consider it when serializing form data.

Solution : You need to write a script to append custom data with your form data or you should use <select> instead of ul-li dropdown.

Other problems with your code.

  • You are using click() event handler with a button having type submit so two events will occur, one is ajax you are calling and another is form will be submitted to server side with GET. To remove is issue you should be listening for form submit() event with preventing event propagation (check this answer).
Community
  • 1
  • 1
Jimish Fotariya
  • 773
  • 6
  • 20
  • I have fix my code follow your suggest. But variable url: '/search' in ajax code and in a python - app.route("/search", methods=["POST"]) def search(): print("True") . Not print "True" in console :( – hoang long Mar 05 '17 at 01:49
  • Console.log() serialized form data and check whether it is sent or not to server. – Jimish Fotariya Mar 05 '17 at 04:49