How can i Create a clone of field like table, dropdown or radio button.
Question
Question
Replies
Hello Sudesh,
What are you exactly trying to do here? Are you trying to duplicate the value of a certain field into another field?
Hello Joseph,
Let me explain.
I am creating a clone of radio button and table on click of Single line field by using below code.
Code :
For cloning Radio button :-
var Radio = $('#q1').clone().attr('id','q3');
$(Radio).insertAfter("#q1");
$(Radio).find( "label span span" ).text('Radio button 2');
var t = $(Radio).find( "fieldset span" );
$(t[0]).find( "input" ).attr("id", "Field2-0");
$(t[0]).find( "input" ).attr("name", "Field2");
$(t[0]).find( "input" ).attr("value", "R2-Yes");
$(t[0]).find( "label" ).attr("for", "Field2-0");
$(t[1]).find( "input" ).attr("id", "Field2-1");
$(t[1]).find( "input" ).attr("name", "Field2");
$(t[1]).find( "input" ).attr("value", "R2-No");
$(t[1]).find( "label" ).attr("for", "Field2-1");
For Cloning table :-
var tab = $('#q6').clone().attr('id','q3');
$(tab).insertAfter("#q6");
Screenshot :
After Submitting the form the clone element or field is not been deliver to Next stage (approval stage).
Screenshot :
Hey Sudesh,
Did you make sure that the javascript Code is also written on later stages?
Yes Joseph,
Same form is sent to next stage so script is same and it should execute.
Screenshot of Property of Next stage :
hello Singh,
What i would like you to do is to add alert("test script") on each step of your script. Which means
- one at the beginning of your code.
- one right before the radio button cloning.
- on right before the table cloning.
We are doing this to check if the script is executing in first place.
Lets see if that reveals something.
Hi Joseph,
here is the code which i am using.
Code :
$(document).on('ready', function (){
alert("test script1");
$("#q2 input").click(function(){
alert("test script2");
var Radio = $('#q1').clone().attr('id','q3');
$(Radio).insertAfter("#q1");
$(Radio).find( "label span span" ).text('Radio button 2');
var t = $(Radio).find( "fieldset span" );
$(t[0]).find( "input" ).attr("id", "Field2-0");
$(t[0]).find( "input" ).attr("name", "Field2");
$(t[0]).find( "input" ).attr("value", "R2-Yes");
$(t[0]).find( "label" ).attr("for", "Field2-0");
$(t[1]).find( "input" ).attr("id", "Field2-1");
$(t[1]).find( "input" ).attr("name", "Field2");
$(t[1]).find( "input" ).attr("value", "R2-No");
$(t[1]).find( "label" ).attr("for", "Field2-1");
});
alert("test script3");
var tab = $('#q6').clone().attr('id','q3');
$(tab).insertAfter("#q6");
$(tab).find( "a" ).css("background-color", "gray");
$(tab).find( "a" ).attr("id", "q10");
// $(tab).find( "h2" ).text('Radio button 2');
// $('input:radio').click(function(){
$(document).on("click", "input:radio" , function() {
alert($(this).val());
alert($(this).attr('id'));
});
alert("test script4");
});
Screenshot :
On click of text field "Single Line" the cone of radio button get's created.
Okay so i need you to run the process as you normally do and tell me which alerts were prompted on the screen.
Before Submitting the Form all three alert ("test script1", "test script3", "test script4") where prompt properly and after clicking on "Single Line" field that clone code get executed with alert("test script2") message init.
Into Next stage when i open the Form only three alert ("test script1", "test script3", "test script4") where prompt the alert within the Clone code doesn't prompt.
oh okay i see now!
So the form is only cloning whenever you click on the field.
In your case i assume that in the next Stage, you are expected to click on the field in order to clone since this is how it is written in the function. But you wanted the cloned fields to appear automatically without clicking in first place.
Maybe if you try triggering the .click() function in the stage, the cloning code will work since it will enter inside the .click() function.
Another question.
The follwoing lines of code
var tab = $('#q6').clone().attr('id','q3'); $(tab).insertAfter("#q6"); $(tab).find( "a" ).css("background-color", "gray"); $(tab).find( "a" ).attr("id", "q10");
were located right after the alert("test script3"). Did it function correctly?
1) Were located right after the alert("test script3"). Did it function correctly?
--> Yes, its working but what is happening is the data within the tables are getting repeated.
While Submitting :
After Submitting :
------------------------------------------------------------------------------------
2) triggering the .click() function in the stage ?
--> It's working but value's are not coming. The behavior is same as above table.
Alright.
Try the following:
- Create another radio button in the first form
- let this radio button be hidden by default and shown whenever you single line field is not blank using fields rules
if this method suits you then you can do the same for the table.
In this way, you wont use the cloning lines of code in the next form. the "cloned elements" will be shown in the next form having the values filled in the previous form.
Thank you, Joseph.
That's a good option. But if we use this method then we are restricting user to use only certain number tables.
Because, in our case user is filling form, so it may required one table or 20 table it's based on there requirement so we need to make this dynamic. Due to which we are looking for cloning method.
Oh okay!
In that case i prefer opening a case with Laserfiche as it may be an internal functionality of the Forms.
Maybe the clone function doesn't translate the values of a previous form.
Would be delightful if you share the results for curiosity.