Home/ Questions/Q 7752389
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-01T11:47:16+00:00

I have a table as below; <table style=width: 100%; border: solid 1px #666600; min-width:

  • 0

I have a table as below;

<table style="width: 100%; border: solid 1px #666600; min-width: 800px" cellpadding="0" cellspacing="0">
<tr>
<td id="aaa">&nbsp;</td>
<td class="content" >&nbsp;</td>
<td class="content" >&nbsp;</td>
<td class="content" >&nbsp;</td>
<td class="content" >&nbsp;</td>
<td class="content" >&nbsp;</td>
<td class="content" >&nbsp;</td>
<td id="bbb">&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td class="title" >&nbsp;</td>
<td class="title" >&nbsp;</td>
<td class="title" >&nbsp;</td>
<td class="title" >&nbsp;</td>
<td class="title" >&nbsp;</td>
<td class="title" >&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>

I am using jQuery ajax and I have script as below;

$(document).ready( function() {
var i = 1;
$.ajax({
  type: 'POST',
  url: 'ajax.php',
  data: 'id=' + i,
  dataType: 'json',
  cache: false,
  success: function(result) {
    $('.title').each(function(index){
      values = result[index].split('*');
      indexa = values[0];
      indexb = values[1];
      if((result[index])){
        $(this).html(indexb);
      }else{
        $(this).html("&nbsp;");
      }
    });
  },
  });
});

The php file will return ["data1*abc","data2*abc","data3*abc","data4*abc","data5*abc","data6*abc"] for i=1, ["data7*abc","data8*abc","data9*abc","data10*abc","data11*abc","data12*abc"] for i=2 etc etc.. The text in class="title" changes accordingly with respect to the data, as abc or whatever it is..

You can see another cell above every title cell having class="content". I have a php file, ajax2.php, which will return an image name with respect to a $_POST["data1"] and $_POST["data2"]. The $_POST["data1"] portion should have value indexa and $_POST["data2"] portion should have value indexb from JavaScript for each ajax request. The images are placed in images folder and the data returned by php file will be only image_name.extension.

In short, I want to change the background image of content cell above title cell to change when data / text in corresponding title cell changes. How can I do the AJAX request and change background image (change background image url)?

I think it will be something like;

$(.content).css({ 'background-image':'url(images/' + imagename });

You can see my fiddle here.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I solved it by;

    $.ajax({
  type: 'POST',
  url: 'ajax.php',
  data: 'id=' + i + '&dir=' + cat,
  dataType: 'json',
  cache: false,
  success: function(result) {
    var $titles = $row.next().next().children('.title');
    var $content = $row.next().children('.content');
    var $flag = $content.children('.flag');
    $('.title').each(function(index){
      if(result[index]){
        var values = result[index].split('*'),
        indexa = values[0],
        indexb = values[1];
        $titles.eq(index).html(indexa);
        $flag.eq(index).html(indexb);
        $.ajax({
                type: 'POST',
                url: 'ajax.php?strip=1',
                data: {
                  filename: Array(indexb, cat, indexa)
                },
                cache: false,
                success: function(result2) {
                  $content.eq(index).css({ 'background-image':'url(images/' + result2 + ')' });
                },
            });
      }else{
        $titles.eq(index).addClass("null");
        $content.eq(index).css({ 'background-image':'url()' });
      }
    });
  },
});
    • 0