CODEWITHSUNDEEP
javascriptjquery
user4419336
user4419336

Reputation:

Set ID as input value on click of an element

When I click on my link it temporary pops up with the id number of that link.

Question How could I make it so if I click on a link then id would add that id to the input value where id is input[id="language_id"]

Code-preview MY Codepen Example

JQUERY

$(document).ready(function() {
  $(".language li a").click(function(event) {

    // Test make sure getting id
    alert(event.target.id);
  });
});

HTML

<div class="container">
  <ul class="dropdown-menu language" role="menu">
    <li><a href="#" id="1">Test 1</a></li>
    <li><a href="#" id="2">Test 2</a></li>
    <li><a href="#" id="3">Test 3</a></li>
    <br/>
    <br/>
  </ul>
  <form action="" method="post" id="language-form">
    <input type="text" name="language" id="language_id" placeholder="Displays ID" value="" />
  </form>
</div>

Upvotes: 1

Views: 1196

Answers (6)

kartik upadhyay
kartik upadhyay

Reputation: 162

To add multiple ids to the control Please give a try to this:

$(document).ready(function() { $(".language li a").click(function(event) { var str = $('#language_id').val() + "," + this.id; $('#language_id').val(str.replace(/^,?/,"")); }); });

Upvotes: 0

Nagaraj S
Nagaraj S

Reputation: 13484

your elementid shoud be unique

$(".language li a").click(function(event) {
    $("input[id=language_id]").val(event.target.id);
});

Upvotes: 1

Shaunak D
Shaunak D

Reputation: 20636

You have elements with the same ID; which is invalid HTML. Change one of them or use classes.

Element.id

It must be unique in a document

For your question use this.id with val(),

$('#language_id').val(this.id)   //or event.target.id

Updated Codepen

$(".language li a").click(function() {
    $('#language_id').val(this.id)
});

Upvotes: 2

top.dev
top.dev

Reputation: 457

$(document).ready(function() {
  $(".language li a").click(function(event) {

    $("#language_id").val(event.target.id);
  });
});

Upvotes: 1

Amal Dev
Amal Dev

Reputation: 1978

You can do like this

$(document).ready(function() {
$(".language li a").click(function(event) {

// Test make sure getting id
//alert(event.target.id);
  $("#language_id").val(event.target.id);
  });
});

Upvotes: 1

Adil
Adil

Reputation: 148150

You can change the id of textbox by setting the id attribute of textbox.

$(".language li a").click(function(event) {
   document.getElementById('language_id').id =  event.target.id;
});

Upvotes: 1

Related Questions