How submit value of input field dynamically

Question

I have some categories:

<div class="cbp-l-inline-title" style=" font-size: 18px;">
    <span style="color: #0669b4">Generic Name:</span> 
    <a><?php echo $category[0]['generic_name'];?></a>
</div>

and I want on click to insert value of this <a> to this form

<form method="post" action="/search/index" class="input-group" style="width: 45%; margin-left: 646px">
    <input type="text" name="search" id="search" class="form-control" minlength=3 placeholder="Generic" aria-label="Recipient's username" aria-describedby="basic-addon2">
    <div id="suggesstion"></div>
    <div class="input-group-btn input-group-append">
        <button class="btn btn-primary btn-outline-secondary" type="submit" name="submit">Search</button>
    </div>
</form>

so that it dynamically starts search of results of this string. I can't send this value to url because it is not latin characters

You will need to use JS if you want to start searching whenever the user types in the input field. — Terry
– Terry, Commented May 10, 2018 at 12:51
No i dont want them to type. when they click the link the value between <a>value</a> should go to input field SEARCH and submit — Iva Kobalava
– Iva Kobalava, Commented May 10, 2018 at 12:53
You still need to use JS: it handles all the scripting that occurs on the client side. What you want is to bind a click even to the <a> element, so that it injects the correct value into your input field. — Terry
– Terry, Commented May 10, 2018 at 12:54

undg · Accepted Answer · 2018-05-11 07:24:15Z

3

html

<div class="cbp-l-inline-title" style=" font-size: 18px;">
  <span style="color: #0669b4">Generic Name:</span> 
  <p class="clickMe">click me: text to send after click</p>
</div>

<form method="post"  class="input-group">
  <input type="text" name="search" id="search" class="form-control" minlength=3
                       placeholder="Generic" aria-label="Recipient's username"
                       aria-describedby="basic-addon2">
  <div id="suggesstion"></div>
  <div class="input-group-btn input-group-append">
     <button class="btn btn-primary btn-outline-secondary" type="submit" name="submit">Search</button>
  </div>
</form>

And javascript in jquery

$('.clickMe').on('click', function(){
  var value = $(this).text()
  $('input#search').val(value)
})

https://jsfiddle.net/ora0j4uu/

.submit() if you want submit it as well https://www.w3schools.com/jsref/met_form_submit.asp

edit: jquery for submit

$('.clickMe').on('click', function(){
  var value = $(this).text()
  console.log(value)
  $('input').val(value)
  $('.input-group').submit()
})

edited May 11, 2018 at 7:24

answered May 10, 2018 at 13:12

undg

8135 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Iva Kobalava Over a year ago

the code is working, but when i add .submit() it does the same. nothing changes

Collectives™ on Stack Overflow

How submit value of input field dynamically

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related