CODEWITHSUNDEEP
jqueryhtml
Suneet
Suneet

Reputation: 97

how to get value from div and place it within img tag src in php

value is coming from this table on clicking a row :

<script>
    var link_base = "<?php echo bloginfo('template_url').'/savelabel/'; ?>" ;
    var img_name = $('#imgdiv').text();
    $('#imgid').attr('src', link_base + img_name);
</script>
<div class="bx2">
    <img id="imgid" alt="" class="imgsty" />    
</div>

Selected filename is showing in a div :

<div id="txtdiv"></div>

And within html, there is an image tag, in which I want to pass value of div (ie the name of image file) into src="" within img tag.

The code which I am trying to achieve this is as shown below :

<script>
  var link_base = "<?php echo bloginfo('template_url').'/savelabel/'; ?>" ;
    var img_name = $('#imgdiv').text();
    $('#imgid').attr('src', link_base + img_name);
</script>
<div class="bx2">
    <img id="imgid" alt="" class="imgsty" />    
</div>

Upvotes: 4

Views: 858

Answers (3)

pavel
pavel

Reputation: 27092

Move script under img - when you try to set src attribute, no image exists.

<div id="txtdiv"></div>

<div class="bx2">
    <img id="imgid" alt="" class="imgsty" />    
</div>
<!-- here or in header link jQuery -->
<script>
    var link_base = "<?php echo bloginfo('template_url').'/savelabel/'; ?>" ;
    var img_name = $('#txtdiv').text();
    $('#imgid').attr('src', link_base + img_name);
</script>

Upvotes: 1

crisu
crisu

Reputation: 150

Take a look at this fiddle. The code runs at onload https://jsfiddle.net/2z7ux3et/2/

It's just an example, you can use any image you want:

<div id="imgdiv">Information_icon.svg</div>
<div class="bx2">
    <img id="imgid" alt="" class="imgsty" />    
</div>
$(function() {
    var link_base = 'http://upload.wikimedia.org/wikipedia/commons/3/35/' ;
    var img_name = $('#imgdiv').html();
    $('#imgid').attr('src', link_base + img_name);
});

Upvotes: 0

Bhushan Kawadkar
Bhushan Kawadkar

Reputation: 28513

wrap your script in $(document).ready(function(){...your code ...});, this will ensure that your DOM structure is ready to process like image in your case is ready to change its src

<script>
  $(document).ready(function(){
  var link_base = "<?php echo bloginfo('template_url').'/savelabel/'; ?>" ;
    var img_name = $('#imgdiv').text();
    $('#imgid').attr('src', link_base + img_name);
 });
</script>

Upvotes: 6

Related Questions