CODEWITHSUNDEEP
javascriptjqueryhtml
Martian.titan
Martian.titan

Reputation: 466

Jquery get element attribute and insert it to an input text

I need help for this issue. I have a list of file and in each one a checkbox input. So i need to check one of that checkboxes and when click on "Insert" button, get the attribute value and insert it to that text input. I appreciate your help.

here is my html code link:

http://jsfiddle.net/Qd3n5/4/

<div class="download_list">
    <div>
        <p class="name"> <a href="#" title="samle-image.gif" class="File_Name">samle-image.gif</a>

        </p>
    </div>
    <div class="size-text">
        <input type="checkbox" name="delete" value="1" class="toggle">
    </div>
</div>
<div class="download_list">
    <div>
        <p class="name"> <a href="#" title="favicon.ico" class="File_Name">favicon.ico</a>

        </p>
    </div>
    <div class="size-text">
        <input type="checkbox" name="delete" value="1" class="toggle">
    </div>
</div>
<div class="download_list">
    <div>
        <p class="name"> <a href="#" title="freedown.jpg" class="File_Name">freedown.jpg</a>

        </p>
    </div>
    <div class="size-text">
        <input type="checkbox" name="delete" value="1" class="toggle">
    </div>
</div>
<div class="fileupload">
    <button type="button" id="Inser_btn" class="btn btn-primary Inser_btn"> <i class="UpIcon icon-remove"></i>
 <span>Insert</span>

    </button>
</div>
<div class="test">
    <input type="text" name="banners_image_local" value="some-text.png" size="51" maxlength="64">
</div>

Upvotes: 2

Views: 1355

Answers (7)

Suyog Sawant
Suyog Sawant

Reputation: 449

here is your code , have updated your JSFiddle used jQuery for doing this click here

$(function(){
$("button").on('click', function(){
    var checked = $("input[type='checkbox']:checked");
    if(checked.length >0)
    {
        var value = checked.val();
        $("input[name='banners_image_local']").val(value);    
    }

});

});

Upvotes: 3

Xlander
Xlander

Reputation: 1331

By doing so:

$(document).ready(function(){
  $('#Inser_btn').click(function(){
      $('.download_list').each(function(){
          var checked = $(this).find('.toggle');
          if(checked.is(':checked')){
            $('input[name="banners_image_local"]').val($(this).find('a').html());
            return false;
          }
      });
  });
});

Here is a demo Fiddle

Upvotes: 3

Mr_Green
Mr_Green

Reputation: 41832

Try this:

$('#Inser_btn').click(function () {
    $('input[name=banners_image_local]').val($('.toggle:checked').parent().prev().find('.File_Name').attr('title'));
});

Working Fiddle

Having a class name to input text would be better.

Upvotes: 2

Sunil Hari
Sunil Hari

Reputation: 1776

Use this piece of Code

$("#Inser_btn").click(function(){
var val = $(".toggle:checked").parent().siblings().eq(0).find("p a").text();
$(".test input").val(val);

});

JSFIDDLE

Upvotes: 3

Teh SoTo
Teh SoTo

Reputation: 209

If you want to get the checked checkboxes value in the input field this should do with jQuery:

$("#Inser_btn").click(function(){
    $("#banners_image_local").val("");
    $('input[name="delete"]:checked').each(function() {
        $("#banners_image_local").val($("#banners_image_local").val() + ($(this).attr('value')));
   });
});

Also set the input text to id="banners_image_local"

Best.

Upvotes: 2

Prabhu Easwar
Prabhu Easwar

Reputation: 153

I am not sure whether this code works for you. Give it a try. (untested code)

$('#Inser_btn').on('click', function () {
   $('input[name="banners_image_local"]').val('');
   var ckText = $('input[name="delete"]:checked').val();
   var textBox = $('input[name="banners_image_local"]').val();
   textBox = textBox + " " + ckText;
   $('input[name="banners_image_local"]').val(textBox);
});

Upvotes: 2

Bhushan Kawadkar
Bhushan Kawadkar

Reputation: 28513

You can try this :

$(function(){
    $('#Inser_btn').click(function(){
        var title='';
        $('input[name="delete"]:checked').each(function(){
            title+=$(this).closest('.size-text').prev().find('a').attr('title');
        });
        $('input[name="banners_image_local"]').val(title);
    });
});

Demo

Upvotes: 3

Related Questions