Question

How to make the field in repeatable table a read only?

Forms

Updated January 15, 2016

asked on March 16, 2015

I have a form with a table field that needs to be filled up by a user, once these fields (Date&Time, From, To and Instruction/Comment fields) had been filled up, it will be routed to the next participant. Those fields that had been filled up by the first participant must be read only to the next participant and the next participant can add new row and must be able to input information to the new fields. Same goes to the next participants those that had been filled up are read only but they can input info to the new fields. Attach is the business process file for your reference. How can I accomplished this using java script? I renamed the file to txt in order to upload it.

Thank you.

0 0

Answer

APPROVED ANSWER

replied on March 16, 2015

$(document).ready(function () 
                  {
                
                var x =    $(".table tr").length; // Returns number of rows + 1
                var y = 2; // Use the number of columns in the table
                var z = (x-1)*(y); // Calculates the counter for the For loop
                for (i=0; i<z; i++) // For each cell in the table
                {
                    
                    if ($(".table input").eq(i).val()  !== "") // If the cell is not empty
                    {  
                      $(".table input").eq(i).prop("readonly", true); // Then, make the cell read only
                    }
 else
	{
    }  }
});

Hey,

This will force the filled cells to be read only when the user loads the Form, no matter the size of the table. The value of "y" should be set to the number of columns you have.

Let me know if you have any questions.

0 0

Replies

replied on March 16, 2015

Hey Manny,

I'm not a Javascript expert, but I have been able to create a method of setting Read-Only on table cells that have been filled. I set a css class on the table named "table".

$(document).ready(function () 
                  {
                  if ($(".table input").eq(0).val() !== "")
                    {  
                      $(".table input").eq(0).prop("readonly", true);
                  }
 else
	{
	}  
});

What this says is, when the Form loads, if cell 0 (which is the first cell in the table) is not empty, then set Read Only status to it.

What you would want to do is loop this code For each cell in the table using a For statement.

I will add to this reply if I can successfully generate a For loop for this code.

Thanks,

0 0

APPROVED ANSWER

replied on March 16, 2015

$(document).ready(function () 
                  {
                
                var x =    $(".table tr").length; // Returns number of rows + 1
                var y = 2; // Use the number of columns in the table
                var z = (x-1)*(y); // Calculates the counter for the For loop
                for (i=0; i<z; i++) // For each cell in the table
                {
                    
                    if ($(".table input").eq(i).val()  !== "") // If the cell is not empty
                    {  
                      $(".table input").eq(i).prop("readonly", true); // Then, make the cell read only
                    }
 else
	{
    }  }
});

Hey,

This will force the filled cells to be read only when the user loads the Form, no matter the size of the table. The value of "y" should be set to the number of columns you have.

Let me know if you have any questions.

0 0

replied on November 30, 2015

Hi Nathan,

I am attempting to use your script on my form. However, my table has 2 columns, where the first column is a dropdown and the second is a multiline field.

Would I need to change anything on the script to make it work? As is, I am not able to get your script to work on my form and I think it's because of the type of fields I'm using.

Thanks

Bennie

0 0

replied on December 2, 2015

Hi Nathan,

Don't worry I got the code working.

 function MakeNotesReadOnly()
  { 
                var x = $(".tblNotes tr").length; // Returns number of rows + 1
                var y = 2; // Use the number of columns in the table
                var z = (x-1)*(y); // Calculates the counter for the For loop
                for (i=0; i<z; i++) // For each cell in the table

                {

                   if ($(".tblNotes select").eq(i).val()  !== "") // If the cell is not empty
                   {  

                      $(".tblNotes select").eq(i).attr('disabled', true); // Then, make all dropdown fields with data read only
                      
                    }
                  if ($(".tblNotes textarea").eq(i).val() !=="")
                  {
                    $(".tblNotes textarea").eq(i).attr('readonly','readonly');  // Then, make all multi Line fields with data read only
                  }

 else 

    {

    } 
                }
  };

0 0

replied on January 15, 2016

Hi there,

Set carried over Table/Collection rows to be read only is supported in Laserfiche Forms 10.

0 0

You are not allowed to follow up in this post.

Question

Question

How to make the field in repeatable table a read only?

Answer

Replies

Sign in to reply to this post.