Combining Two Javascript from Matrix table vs. Side by Side | XM Community
Skip to main content

Hi!  I’m not very knowledgeable about Javascript, so I’m looking for some help.  I have two scripts I’m trying to combine. 

The first image is the script for inserting slashes to make answers appear as dates (00/00/000).  It is formatted for a side-by-side survey question.

The second is to hide lines but have an Add button so the respondent can add lines in a Matrix table as needed.  

Both of them work fine on their own, but when I try and combine them they don’t both work.  I’m not sure if it’s because the first is formatted for Side-by-Side and the second for a Matrix table and there’s something in the code that is specific for those types of tables, or if there is a problem with variable names?  

Thanks for any recommendations you can make!

~Rebekah

 

Here is my attempt at combining the two, but I know it doesn’t work:

Qualtrics.SurveyEngine.addOnload(function()
{
    jQuery("#"+this.questionId+" tr.ChoiceRow:not(:lt(1))").hide();

});
Qualtrics.SurveyEngine.addOnReady(function(){

jQuery("#" + this.questionId + " .InputText").each(function() {
        new Cleave(jQuery(this), {
            date: true,
            delimiter: '/',
            datePattern: d'm', 'd', 'Y']
var that=this.questionId;
jQuery("#"+this.questionId+"tr.ChoiceRow:not(:lt(1))").hide();
jQuery("<input type='button' id='add' value='Add Deployment' name='+' />").insertAfter("#"+this.questionId+" tr.ChoiceRow:last");
jQuery("#add").on('click',function(){
    var c= jQuery("tr.ChoiceRow:visible").length;
jQuery("#"+that+" tr.ChoiceRow:eq("+c+")").show();
    });
});

Qualtrics.SurveyEngine.addOnUnload(function(){
    /* Place your JavaScript here to run when the page is unloaded */
});
 

 

Both of them work fine on their own, but when I try and combine them they don’t both work.  I’m not sure if it’s because the first is formatted for Side-by-Side and the second for a Matrix table and there’s something in the code that is specific for those types of tables

@rebekahn They are not just formatted for type of table, they are formatted for specific questions.

So what you’re trying to do and what is your question looks like?

@rebekahn,

Is you new question a matrix or side-by-side?

@rebekahn,

Is you new question a matrix or side-by-side?

The new question is a matrix. It should look like the first image when editing the survey, and look like the second image in the preview. These look correct, but I can’t get the slash marks for the dates to appear.

 

 

Both of them work fine on their own, but when I try and combine them they don’t both work.  I’m not sure if it’s because the first is formatted for Side-by-Side and the second for a Matrix table and there’s something in the code that is specific for those types of tables

@rebekahn They are not just formatted for type of table, they are formatted for specific questions.

So what you’re trying to do and what is your question looks like?

The new question is a matrix. It should look like the first image when editing the survey, and look like the second image in the preview. These look correct, but I can’t get the slash marks for the dates to appear.

 

@rebekahn,

Change this line:

jQuery("#" + this.questionId + " .InputText").each(function() {

to:

jQuery("#" + this.questionId + " [type=text]").each(function() {

 

@rebekahn The class of text box in matrix question is not .InputText, so just change your Cleave.js code part to  inputpid^='QR~QID']

jQuery("#" + this.questionId + " inputpid^='QR~QID']").each(function() {
        new Cleave(jQuery(this)i0], {
            date: true,
            delimiter: '/',
            datePattern: n'm', 'd', 'Y']
        });
    });

Hope this helps

Leave a Reply


Terms & Conditions