CODEWITHSUNDEEP
javascriptjqueryajax
user4082764
user4082764

Reputation:

Jquery Click send doesn't work

Hi everyone i have one question about jquery click send function. I have created this demo from jsfiddle. So if you visit the demo then you can see there is one smiley and textarea. When you write some text and press enter then the message sending successfully. But i want to add also when you click the smiley then it need to send (w1) from the image sticker="(w1)" like click to send. But click send function doesn't work. What is the problem on there and what is the solution ? Anyone can help me in this regard ?

JS

$('.sendcomment').bind('keydown', function (e) {
    if (e.keyCode == 13) {
        var ID = $(this).attr("data-msgid");
        var comment = $(this).val();

        if ($.trim(comment).length == 0) {
            $("#commentload" + ID).text("Plese write your comment!");
        } else {
            $("#commentload" + ID).text(comment);
            $("#commentid" + ID).val('').css("height", "35px").focus();
        }
    }
});
/**/
$(document).ready(function() {
$('body').on("click",'.emo', function() {

        var ID = $(this).attr("data-msgid");
        var comment = $(this).val();

        if ($.trim(comment).length == 0) {
            $("#commentload" + ID).text("nothing!");
        } else {
            $("#commentload" + ID).text(comment);
            $("#commentid" + ID).val('').css("height", "35px").focus();
        }

 });
});
    $('body').on('click', '.sm-sticker', function(event) {
        event.preventDefault();
        var theComment = $(this).parents('.container').find('.sendcomment');
        var id = $(this).attr('id');
        var sticker = $(this).attr('sticker');
        var msg = jQuery.trim(theComment.val());

        if(msg == ''){
            var sp = '';
        } else {
            var sp = ' ';
        }

        theComment.val(jQuery.trim(msg + sp + sticker + sp));
    });

HTML

<div class="container one">
 <div class="comments-area" id="commentload47">comments will be come here</div>
 <div class="user-post" id="postbody47">
    <textarea class="sendcomment" name="comment" id="commentid47" data-msgid="47"></textarea>
    <div class="stiemo">
     <img src="http://d.lanrentuku.com/down/png/1009/networking/emoticon_inlove.png" class="sm-sticker emo" sticker="(w1)"> click smiley to send (w1)</div>
   </div>
  </div>
</div>

Upvotes: 1

Views: 87

Answers (2)

J Santosh
J Santosh

Reputation: 3847

try this :

just append below JS after the line theComment.val(jQuery.trim(msg + sp + sticker + sp));

var e = $.Event("keydown");
e.keyCode = 13; // # Some key code value
$('.sendcomment').trigger(e);

Demo

Upvotes: 0

vaske
vaske

Reputation: 9542

you should use this:

$('body').on("click",'.emo', function() {

    var ID = $('.sendcomment').attr("data-msgid");
    var comment = $('.sendcomment').val();

    if ($.trim(comment).length == 0) {
        $("#commentload" + ID).text("nothing!");
    } else {
        $("#commentload" + ID).text(comment);
        $("#commentid" + ID).val('').css("height", "35px").focus();
    }

});

so basically instead of this you have to use input and get msgid and val from there, use same approach for rest. So when you are attaching event on some button and you want to use data from some other dom element you have to get that element by using $(selector) under your delegated function, really simple approach.

Upvotes: 0

Related Questions