Question

I have this HTML:

<div class="problem_comment_text" id="suggested_solution_text_110" ><p style="font-family: arial;">Solution name: <a class="expand_suggested_solution" href="#" data-suggestion_id="110"  data-problem_id="228">Site to get peoples memories and experiences of every past game</a></p><p style="font-family: arial;">A site that would have a listing of every game for a particular team, and for each game, the fans who saw that game could share their memories of it.  That would give a very holistic view of the game and people would discover much more about their team and the fans of those teams.</p><p style="color: #B77F37;">on Monday, 11-21-2011</p><div style="float:right; width: 250px;"><a class="delete_suggested_solution" data-problem_id="228" data-suggested_solution_id="110" href="#">Delete</a> | <a href="#" class="edit_suggested_solution" data-problem_id="228" data-suggested_solution_id="110" data-solution_text="A site that would have a listing of every game for a particular team, and for each game, the fans who saw that game could share their memories of it.  That would give a very holistic view of the game and people would discover much more about their team and the fans of those teams." data-solution_title="Site to get peoples memories and experiences of every past game">Edit</a></div></div>

and I have this jQuery:

$('.edit_suggested_solution').live('click' , function() {
    // Showing the wait image
    $("#loading").show();

    var problem_id = $(this).attr("data-problem_id");
    var suggested_solution_id = $(this).attr("suggested_solution_id");  
    var solution_title = $(this).attr("solution_title");          
    var solution_text = $(this).attr("solution_text");

    var dataString = 'problem_id='+ problem_id + '&suggested_solution_id=' + suggested_solution_id + '&solution_title=' + solution_title + '&solution_text=' + solution_text;

    alert ("data string: " + dataString );
});

The problem is that when the user presses the edit link, out of the 4 variables which I am trying to get, I can only get the problem_id and the rest are undefined.

Does anyone notice any particular problems with the code to understand why the other variables are undefined?

Answer 1

It seems to me you shouldn’t use attr but data to get data- attributes.