Copy/duplicate child item

[Oz.Ab]

Hi guys.

Hope you can assist me. I have the following requirements:

1. Create parent item
2. Create child items but they need to be able to copy a child item because next child item is almost identical. It saves the user a lot of time if he can copy the previous child item.

Solution A)
Use related items in grid mode.
This approach is the cleanest and very easy to set up.
BUT this is not possible because 3 columns are external data columns that don't work in grid mode.

My current suggestion)
1. Open "Parent New Form" - fill the form, press "save and create child item" , redirect to "Parent Edit Form"
2. "Parent Edit Form" displays child list in related items.
3. Press "Add new" to add child item, it opens "Child New Form" - fill the form, press "Save", get back to "Parent Edit Form".
4. Now I can see the first child item in the "Parent Edit Form". The first column in the child item related items is a calculated column with the text "Copy Child Item". When pressing this link the "Child Edit Form" opens up but redirects me straight away to "Child New Form" with all the data from the child item I created earlier.

Problem with this approach is that I don't know how I can:
> press "Copy Child Item"
> Open the "Child Edit Form"
> Copy the data (perhaps using url parameter?)
> Open "Child New Form" with all the data from the previous child item

Can you help me with the above or do you have another suggestion in how to do this?

Thankful for all support <3

[Nikita Kurguzov]

Hello, Oz!
If possible, I would recommend to implement this functionality with Workflow:
First Child item created -> Workflow Starts -> Creates new Item with same info

But I can't be sure if it can handle your external data columns.

If you really want to implement functionality with just JS and Related Items, that's possible.

You can add fd.onsubmit() function to your Child New Form which will store all the data from the fields in Local Storage, for example.

Then you can also add a function which will check if there is data in the Local Storage already and if there is, it will populate Child form fields with it.

All of that can be done in Child New Form JS editor and will allow you to create unlimited number of copies.

So, for example code like this should work:

Code: Select all

if(localStorage.getItem('Title')){
  fd.field('Title').value(localStorage.getItem('Title'));
}

fd.onsubmit(function(){
  localStorage.setItem('Title', fd.field('Title').value());
  return true;
});

Then I would recommend to use localStorage.removeItem('Title'); to clean local storage. This can be used on Parent form, when the Parent form opens and submits, so each time you'll have it clean and won't store it for longer than necessary, even if you create several items in a row.

Finally, I am not quite sure why you need to redirect users to Edit Form as items can be added to Related Items from the New Form as well.

[Oz.Ab]

Thanks for your insight Nikita.

I will continue with this project later this week and will write here the results.

Regards

[Oz.Ab]

Hi Nikita.

This is working very well.
Here is a small example of the fields I need to set to localStorage in the New Form:

fd.onsubmit(function(){
//simple fields
localStorage.setItem('singleTextField', fd.field('singleTextField').value());
localStorage.setItem('lookupField', fd.field('lookupField').control('getSelectedText'));

//complex fields, choice field with "specify your own value" option
var MAN = fd.field('choiceFieldWithSpecifyYourOwnValue').value();
var MANspecify = fd.field('choiceFieldWithSpecifyYourOwnValue').control()._el().find('input[type=text]').val();
if (MAN.length == 0) {
localStorage.setItem('choiceFieldWithSpecifyYourOwnValue', fd.field('choiceFieldWithSpecifyYourOwnValue').control()._el().find('input[type=text]').val());
//Here I am trying to set the variable length = 0, into the localStorage:
localStorage.setItem('MAN', MAN.length);
} else {
localStorage.setItem('choiceFieldWithSpecifyYourOwnValue', fd.field('choiceFieldWithSpecifyYourOwnValue').value());
}
return true;
});

Then when I open up the new form the second time the following fields are set:

if(localStorage.getItem('singleTextField')){
fd.field('singleTextField').value(localStorage.getItem('singleTextField'));
}
if(localStorage.getItem('lookupField')){
fd.field('lookupField').value(localStorage.getItem('lookupField'));
}

But I have trouble with setting the choice field if the "specify your own value" was filled out:
if(localStorage.getItem('choiceFieldWithSpecifyYourOwnValue')){
if(localStorage.getItem('MAN') == 0) {
fd.field('choiceFieldWithSpecifyYourOwnValue').control()._el().find('input[type=text]').val()
} else {
fd.field('choiceFieldWithSpecifyYourOwnValue').value(localStorage.getItem('choiceFieldWithSpecifyYourOwnValue'));
}
}


So everything works except for my trouble with the "specify your own value".
As you can see I am trying the following:
- If specify your own value is filled out then that is added to localStorage but I am also trying to add the variable MAN with the value 0 to localStorage. (I don't know if I am adding the variable the right way into the localStorage)
- When a new form is opened again they will check if the variable MAN is = 0, if yes, then the localStorage will set the "specify your own value" input field. (I don't know how to set the input field from the local storage).

Christmas regards

[Nikita Kurguzov]

Dear Oz,
Here's an example of collecting value from Choice Fill in field based on input selected by the user:

Code: Select all

//get simple field values from the storage 
if(localStorage.getItem('Title')){
  fd.field('Title').value(localStorage.getItem('Title'));
}

//working with Fill In Choice
// I first, get control to shorten the syntax:
var $choiceControl = fd.field('ChoiceFillIn').control()._el();
  
if (localStorage.getItem('Choice')){
    // If we have Choice stored:
    fd.field('ChoiceFillIn').value(localStorage.getItem('Choice'));
    // Also select the radio input
    $choiceControl.find('input[id$=DropDownButton]')[0].checked = true;
} else if (localStorage.getItem('ChoiceFillIn')){
    // If we have Fill In Choice stored:
    $choiceControl.find('input[type=text]').val(localStorage.getItem('ChoiceFillIn'));
    // Also select the radio input
    $choiceControl.find('input[id$=FillInButton]')[0].checked = true;
}

fd.onsubmit(function(){
  //store simple field values in the storage 
  localStorage.setItem('Title', fd.field('Title').value());
  
  //working with Fill In Choice
  // I first, get control to shorten the syntax:
  var $choiceControl = fd.field('ChoiceFillIn').control()._el();
  if ($choiceControl.find('input[id$=DropDownButton]')[0].checked){
      //If DropDown radio button is selected
      localStorage.setItem('Choice', fd.field('ChoiceFillIn').value());
      localStorage.setItem('ChoiceFillIn', "");
  } else {
      localStorage.setItem('ChoiceFillIn', $choiceControl.find('input[type=text]').val());
      localStorage.setItem('Choice', "");      
  }
  return true;
});

Christmas regards to you, too!

[Oz.Ab]

This is working beautifully - thanks a lot