ogheo / yii2-comments

Comments module for Yii2.
MIT License
11 stars 9 forks source link

infinite scroll #5

Open valexus1 opened 6 years ago

valexus1 commented 6 years ago

hi ! thank you for your module, seems perfect.. maybe for table prefix in comments model public static function tableName() { return '{{%comments}}'; }

and in _form.php 'action' => Url::to( '/comments/default/create' and validation url 'validationUrl' => Url::to(['/comments/default/validate']),

i have add a slash for my configuration.

my problem: i have a page with multi item and infinite scroll pagination. i've seen in code the register asset output

jQuery('#w0-comments').comment({"wrapperId":"#w0-comments","formSelector":"#w0-comment-form","showCommentsId":"#w0-show-comments","fullCommentsId":"#w0-comments-full","pjaxContainerId":"#w0-comments-container","formContainerId":"#w0-comments-container-form","submitButtonId":"#w0-submitButton","postButtonName":"Post","replyButtonName":"Reply","ratingUrl":"/it/user/comments/default/rate"}); | jQuery('#w0-comment-form').yiiActiveForm([{"id":"comments-content","name":"content","container":".field-comments-content","input":"#comments-content","validateOnChange":false,"validateOnBlur":false,"validate":function (attribute, value, messages, deferred, $form) {yii.validation.required(value, messages, {"message":"Share your thoughts... non può essere vuoto."});yii.validation.string(value, messages, {"message":"Share your thoughts... deve essere una stringa.","min":4,"tooShort":"Share your thoughts... dovrebbe contenere almeno 4 caratteri.","skipOnEmpty":1});}}], {"validationUrl":"/it/comments/validate"}); | jQuery(document).pjax("#w0-comments-container a", {"push":true,"replace":false,"timeout":1000,"scrollTo":false,"container":"#w0-comments-container"}); | jQuery(document).on("submit", "#w0-comments-container form[data-pjax]", function (event) {jQuery.pjax.submit(event, {"push":true,"replace":false,"timeout":1000,"scrollTo":false,"container":"#w0-comments-container"});});

how can i make your code working with the ias option running? any suggestions? thank you very much!

valexus1 commented 6 years ago

i've seen when infinite scroll finish loading the id of the next elements is the same, seems restarting...

like #w0-comments #w1-comments #w2-comments #w0-comments #w1-comments #w2-comments ecc..

my code is echo Comments::widget([ 'model' => $modell, 'model_key' => $model->id ]);

valexus1 commented 6 years ago

i ve found a solution, changing in

echo Comments::widget([ 'model' => $modello, 'model_key' => $modello->id, 'id' => 'w'.$modello->id ]);

and in javascript i've insert this, seems quite working the problem now is only when i submit the form go up on the top of the page and does not return the content of the comment, when refresh the page obviously the content appear.

if ( typeof iass != "undefined") { iass.on("rendered", function(items) {

            var $items = $(items);

            $items.each(function() {
                var wcomments   =  $( this ).find(".comments").attr("id");
                var str = wcomments;
                var res = str.replace("-comments", "");
                res = "#"+res;
                console.log(res);
                jQuery(res+"-comments").comment({
                "wrapperId":res+"-comments",
                "formSelector":res+"-comment-form",
                "showCommentsId":res+"-show-comments",
                "fullCommentsId":res+"-comments-full",
                "pjaxContainerId":res+"-comments-container",
                "formContainerId":res+"-comments-container-form",
                "submitButtonId":res+"-submitButton",
                "postButtonName":"Post",
                "replyButtonName":"Reply",
                "ratingUrl":"/comments/default/rate"});              
                jQuery(res+"-comment-form").yiiActiveForm([{"id":"comments-content","name":"content","container":".field-comments-content","input":"#comments-content","validateOnChange":false,"validateOnBlur":false,"validate":function (attribute, value, messages, deferred, $form) 
                {yii.validation.required(value, messages, {"message":"Share your thoughts... non può essere vuoto."});
                yii.validation.string(value, messages, {"message":"Share your thoughts... deve essere una stringa.","min":4,"tooShort":"Share your thoughts... dovrebbe contenere almeno 4 caratteri.","skipOnEmpty":1});}}], 
                {"validationUrl":"\/it\/comments\/validate"});

                jQuery(document).pjax(res+"-comments-container a", {"push":true,"replace":false,"timeout":1000,"scrollTo":false,"container":res+"-comments-container"});
                    jQuery(document).on("submit", res+"-comments-container form[data-pjax]", function (event) {
                    jQuery.pjax.submit(event, {"push":true,"replace":false,"timeout":1000,"scrollTo":true,"container":res+"-comments-container"});
                });
            }); 
        });
    }
ogheo commented 5 years ago

Hi valexus1, by ias you're meaning https://github.com/webcreate/infinite-ajax-scroll ? I'll try to look these days if I'll have some free time...