Jquery get element attribute and insert it to an input text

Question

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>

In future questions, please always include your code in the question. If jsfiddle was unavailable your original question would not have been answerable. — Rory McCrossan
– Rory McCrossan, Commented Jul 16, 2014 at 7:07
what is "the attribute value"? do you mean the checkbox value? — Amin Jafari
– Amin Jafari, Commented Jul 16, 2014 at 7:14
Actually i tried multiple time to include my code here but unfortunately it wasn't let me to do that. there is no some documentation to help adding code here. But thank alot for your help @RoryMcCrossan — Martian.titan
– Martian.titan, Commented Jul 16, 2014 at 8:46
@AminJafari I mean the title attribute for a tag in p.class:name — Martian.titan
– Martian.titan, Commented Jul 16, 2014 at 8:49

Bhushan Kawadkar · Accepted Answer · 2014-07-16 07:16:30Z

3

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

answered Jul 16, 2014 at 7:16

Bhushan Kawadkar

28.6k5 gold badges39 silver badges61 bronze badges

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

Comments

Sunil Hari · Accepted Answer · 2014-07-16 07:27:45Z

3

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

answered Jul 16, 2014 at 7:27

Sunil Hari

1,7941 gold badge12 silver badges20 bronze badges

Comments

Xlander · Accepted Answer · 2014-07-16 07:35:54Z

3

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

answered Jul 16, 2014 at 7:35

Xlander

1,33112 silver badges24 bronze badges

Comments

Suyog Sawant · Accepted Answer · 2014-07-16 07:43:53Z

3

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);    
    }

});

});

answered Jul 16, 2014 at 7:43

Suyog Sawant

4691 gold badge4 silver badges12 bronze badges

Comments

Prabhu Easwar · Accepted Answer · 2014-07-16 07:16:42Z

2

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);
});

answered Jul 16, 2014 at 7:16

Prabhu Easwar

1531 gold badge2 silver badges10 bronze badges

Comments

Teh SoTo · Accepted Answer · 2014-07-16 07:17:43Z

2

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.

answered Jul 16, 2014 at 7:17

Teh SoTo

2091 silver badge11 bronze badges

Comments

Mr_Green · Accepted Answer · 2014-07-16 07:30:30Z

2

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.

edited Jul 16, 2014 at 7:30

answered Jul 16, 2014 at 7:25

Mr_Green

42k48 gold badges171 silver badges277 bronze badges

Collectives™ on Stack Overflow

Jquery get element attribute and insert it to an input text

7 Answers 7

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related