Jquery, .val () does not take input text [closed]

Navigation
0

I have a following code:

INPUT 

<div class="row">
    <div class="form-group">                                                                
        <div class="col-sm-3">                                                                      
            <div class="form-group input-group">
                <input id="contact-input" type="text" id="search" class="form-control input-search-doc" placeholder="Documento" required>
                <span class="input-group-btn">
                    <button class="btn btn-default btn-search-doc" type="button">
                    <i class="fa fa-search"></i>
                </button>
                </span>
            </div>
        </div><!-- <div class="col-sm-3"> -->                                                                                           
    </div><!-- <div class="form-group"> -->
</div><!-- <div class="row"> -->

AJAX 

$(".btn-search-doc").on("click",function(){
    var title = $(this).find('input.input-search-doc').val();
    alert(title);   
    $("#result").html("<img src='ajax-loader.gif'/>");

    $.ajax({
        type:"post",
        url:"../connect/post/select.php",
        data:"title="+title,
        success:function(data){
            $("#result").html(data);
            $("#search").val("");
         }
      });

});

It should get the text inside the input and send via Ajax to my select, but it can not get the text inside the input "input-search-doc" , always returns it to me in var_dump : string 'undefined' (length = 9)

Does anyone have an idea why it is not taking any value?

    
asked by anonymous 17.10.2016 / 21:40

2 answers

4

Simply use: 

$('#contact-input').val();

Or 

$('.input-search-doc').val();
    
17.10.2016 / 21:57
0

Hello, how are you?

I think the problem is when you instantiate the 'title' variable: 

$(".btn-search-doc").on("click",function(){
    var title = $(this).parents('.input-group').find('input.input-search-doc').val();
    alert(title);   

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><divclass="row">
    <div class="form-group">                                                                
        <div class="col-sm-3">                                                                      
            <div class="form-group input-group">
                <input id="contact-input" type="text" id="search" class="form-control input-search-doc" placeholder="Documento" required>
                <span class="input-group-btn">
                    <button class="btn btn-default btn-search-doc" type="button">
                    <i class="fa fa-search"></i>
                </button>
                </span>
            </div>
        </div><!-- <div class="col-sm-3"> -->                                                                                           
    </div><!-- <div class="form-group"> -->
</div><!-- <div class="row"> -->

To keep the context where your button is wrapped using $ (this), you need to use the ".parents ('.input-group')" button to change the context of the button to the div containing the button the input field, to only then use the ".find ()" to find the field.

Or

Since you are defining a unique pro input identifier, you could search the same as: $ ('# contact-input').

    
17.10.2016 / 22:19
How do I return a valid result from an operation in PHP? make: g ++: Command not found make: Error 127