H
H
hottab_12017-07-09 18:01:23
PHP
hottab_1, 2017-07-09 18:01:23

AJAX sending and receiving data on click, how?

Hello!
There is a site on Joomla 3.
It implements the following functionality using JS: there is a block, when you click on it, another block is shown, when you click again, the block that was shown is hidden. Screenshot attached.
You need to make it so that when you click on the "Show" block, the click is counted and in block2 (which is shown) the number of clicks on the "Show" block is displayed. It should be written to a file using AJAX. In simple words, the counter of clicks on the element.
Now everything is done a little "crutch". I bring the code:

<form id="myForm"> 
        <input id="username" type="text" size="20" value="yes"  style="display:none;"><br/><br/>  
        <input type="submit"  value="" >  
</form>

$(document).ready(function(){  
          
            $('#myForm').submit(function(){  
                $.ajax({  
                    type: "POST",  
                    url: "1.php",  
                    data: "username="+$("#username").val(), 
                    success: function(html){  
                        $("#content").html(html);  
                    }  
                });  
                return false;  
            });  
              
        });

The "yes" value catches the php handler and increments the value in the file, and also displays this value in it.
And this is how the construction that hides and shows the block looks like:
<div class="raz btn-primary" id="myObj" >Показать номер телефона</div>
<div class="del">
<div id="content"></div>  
+7(900) 000-00-00
</div>

JS:
$('.raz').on('click', function(){
    var $that = $(this),
        nc = $that.next('.del').length,
        block = nc ? $that.next('.del') : $that.parent('.del');
    block.slideToggle(function(){
        $('.raz',block).add(block.prev('.raz'))
        .text(block.is(':visible') ? 'Скрыть' : 'Показать номер телефона');
    });  
});


Question: how to make it so that AJAX sending and displaying the number of clicks occurs when you click on the element: Show phone number?
What needs to be changed in the JS code?
Tell me please.
f1c270bf1d7e4671afc7f821028c3b2f.png

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question