how to change the text in element via ajax?

Question

I have a button of download,when clicked it should change the text of the element span but I have problem in ajax part

after clicking it will show me a little button and the text will not change

here is my html

//somecode
    <span class="num">Downloaded:<?php echo $downloadcount;?></span>
     </td></tr>
     </table>
     </div>
<button type = "button" class="button" id="<?php echo $id; ?>" name="dl">
    <a href='./mp3/<?php echo basename($filename);?>'>Download</a>
</button>
         </td>
     </tr>
    </table>

here is my ajax:

    $(function() {
        $(".button").click(function() 
        {
        var id = $(this).attr("id");
        var name = $(this).attr("name");
        var dataString = 'id='+ id ;
        var parent = $(this);
        if(name=='dl')
        {
        $(this).fadeIn(200).html('<img src="dot.gif" align="absmiddle">');
        $.ajax({
           type: "POST",
           url: "download_number.php",
           data: dataString,
           cache: false,

           success: function(html)
           {
//THE PROBLEM IS HERE
            $(".num").text(html);

          }  });

        }
        });
        });

I also tried $(".num").html(html);

after clicking it will show me a little button and the text will not change — Nickool, Oct 12 '12 at 18:50
@nikparsa: Then the `success` callback isn't running. Try `error` instead of `success`. — Blender, Oct 12 '12 at 18:53
it shows me [ObjectXmlHttprequest] with error instead of success — Nickool, Oct 12 '12 at 18:55
can you try doing in $.ajax { data: {id : id}} instead of dataString — insomiac, Oct 12 '12 at 19:03
it shows nothing,I'm sure data string doesn't have problem because in div elements I have this code and it is working — Nickool, Oct 12 '12 at 19:06

score 2 · Accepted Answer · answered Oct 12 '12 at 18:53

2

You shouldn't put an <a> inside the <button> - the link will win over the button action [see fiddle].

Beyond this, your code seems right.

answered Oct 12 '12 at 18:53

moonwave99

21,957
3
43
64

but I want to download my file removing that will loose my file – Nickool Oct 12 '12 at 18:57
Then why do you need both a link and a button? Stick with one and you're done ^^ – moonwave99 Oct 12 '12 at 18:59
Ok I think you need that for stats purpose - serve your files not via vanilla apache, but process them via PHP, save your stats then forward binary mp3 data. – moonwave99 Oct 12 '12 at 19:00
when clicking the button I want user to download the file and with ajax simultaneously update the download number – Nickool Oct 12 '12 at 19:00
I don''t know about vanila?! I am using wamp apache and the whole is with php what do u mean? – Nickool Oct 12 '12 at 19:01
Check [this answer](http://stackoverflow.com/questions/1516779/setting-up-apache-to-serve-php-when-an-mp3-file-is-requested): you serve the mp3 file via PHP, but you may perform an update query before ^^ – moonwave99 Oct 12 '12 at 19:03
I will do it if it was the last resort – Nickool Oct 12 '12 at 19:08
you were right thanks a lot,after editing a lot that people told me,and removing the link I thaught you're wrong but in my origin I removed the link and now it's working,Thank you so much! – Nickool Oct 12 '12 at 19:19

score 0 · Answer 2 · answered Oct 12 '12 at 18:52

0

change datastring to this

var dataString = "{'id'="+ id+"}" ;

and add datatpe json...By doing so it may work....just guessing

datatype:'json', 
  success: function(html)
               {
               alert(html);
               // First see...what u r getting in response and then move forward

              }

answered Oct 12 '12 at 18:52

Ankush Jain

5,654
4
32
57

it shows nothing just after a second show me my file ready to download – Nickool Oct 12 '12 at 18:53
data string doesn't have problem as sure – Nickool Oct 12 '12 at 18:58

how to change the text in element via ajax?

2 Answers2