You are viewing limited content. For full access, please sign in.

Question

Question

Pass data from one table field to another on the same process

asked on June 11, 2018

Hi All,

 

Another curly one, 

I am trying to achieve this and please let me know if further information is required?

Based on the Items required, I want to be able to specify which ones can also be selected on a table within the same process…

The process as a whole:

 

I.e I have 3 line items for example, and the supplier needs to be contacted regarding two of the parts only. How can you show what parts can be selected dynamically?

 

The above shows you the parts they can add, they can have as many as they want…

 

Now, when they select a supplier from the table below that, I have given them the option to say “Yes” all parts or pick which parts you want to send to the specific supplier

i.e

 

 

If they say “No” from all items, I want it to show me in a checkbox the parts that they can select, but it is dynamically populated based on the items initially required?

 

Is this possible? To auto show / populate from a previous Table? 

 

Any feedback would be kindly appreciated, 

 

With many Thanks

Ziad

0 0

Replies

replied on June 12, 2018 Show version history

This is from another post I was reading which will tell you how many lines in a table

Chris Cartrett / User  355  22 • replied on June 8 • Show version history
Use javascript to get the .length from the table. This will return how many rows are present.

var totalRows = $('#q119 tr').length;   or   var totalRows = $('#q119 tr').length-1;    

The 'tr' is row, so it counts all rows. Use the "-1" to exclude the header label row.

Test it by putting the code into the console.log to make sure you get back the value you are looking for:

console.log(  $('#q119 tr').length );  or console.log(  $('#q119 tr').length-1 );

You will need this to create the Dynamic Checkboxes but I've not seen that done.

1 0
replied on June 12, 2018

Hi Steve,

 

Are you able to provide me with the link to that post as well? if you do not mind? 

 

Thanks

Ziad

0 0
replied on June 13, 2018

Hi Ziad,

 

Dynamic checkboxes are possible, however to get any sort of routing on them or to have them show in the saved form might be a bit of a challenge. In the code I have created a function that you can call upon on form load / table add row and table delete row. Please note thought that this is not a complete solution for you. i.e. there are a few bugs with the code and how it operates. This is merely to get you on the right track.

//Function to call on form load / add-row / delete row
//readTableId as q17 or your table number that you want to read from
//readTableInputCSS field is the css field you want to read from. This is only set to read one field currently
//checkbox field id just number - ie. qID of field is q36 then just input 36 here
function UpdateDynamicCheckbox(readTableID, readTableInputCSS,checkboxID,outputTableID){ 
  //set variables 	
  var tID = readTableID;
  	var oTID = outputTableID;
  	var cID = checkboxID;
  	var inVal = readTableInputCSS;
    var i = 1;
  	//used to update each row in output table
  $('#'+oTID+'.cf-table-block tbody tr').each(function(){
    var cnum = 0;
    //get checkbox element id
  	var element = document.getElementById('Field'+cID+'('+i+')');
    //clear the contents to add new
    element.firstChild.innerHTML = "";
	var html;
  //loop through input table to get checkbox variables
  $('#'+tID+'.cf-table-block tbody tr').each(function(){
    //find css of input field as specified - can add more here if required
    var inValue = $(this).find('.'+inVal+' input').val();
    //if index is less than table length and input value is not blank
    if (cnum < ($('#'+tID+' tr').length-1) && inValue != ""){ 
      //set display value
      var display = inValue;
      //set value and replace spaces with underscore
      var value = inValue.replace(" ", "_");
      //create html
      html = '<span class="choice"><input name="Field'+cID+'('+i+')" id="Field'+cID+'('+i+')-'+cnum+'" type="checkbox" value="'+value+'" vo="e" data-parsley-class-handler="#Field'+cID+'\('+i+'\)" data-parsley-errors-container="#Field'+cID+'\('+i+'\)" data-parsley-multiple="Field'+cID+'('+i+')"onclick="handleChkbxClick(this);"><label class="form-option-label" for="Field'+cID+'('+i+')-'+cnum+'">'+display+'</label></span>';
   	  //insert html at end of child element
      element.firstChild.insertAdjacentHTML("beforeEnd", html);
      //increase for row count
      cnum++;
		}
  });
    //for second row in output table
  i++;
});
}
//custom function that will be added to created checkbox
function handleChkbxClick(cb) {
  //get checkbox value
  var value = cb.value;
  //get checkbox name
  var name = cb.name;
  //run regular expressions to get the row count
  var rowNumIn = /[(]\d[)]/.exec(name);
  var rowNum = /\d/.exec(rowNumIn);
  //find email in supplier table for specified index number
  var email = $('#q35 tbody tr:nth-child('+rowNum+')').find('.email input').val();
  //loop through parts table
  $('#q17.cf-table-block tbody tr').each(function(){
   //if value in parts table matches value of selected checkbox
	if( $(this).find('.qty input').val() == value)
    {//get the current email list of the row
      var current = $(this).find('.emailList textarea').val() || "";
      if(cb.checked)//check to make sure checkbox is checked
  	{ //if length of email list is > 3 then append list, else just insert email
      if (current.length > 3){$(this).find('.emailList textarea').val(current +"; "+email);}
      else {$(this).find('.emailList textarea').val(email);}
    }
    else
    { //if unchecked checkbox, replace email with blank.
      var remove = current.replace(email, "");
      $(this).find('.emailList textarea').val(remove);
    }
  }
  }); 
}
$(document).ready(function(){
 UpdateDynamicCheckbox('q17','qty','36','q35'); 

  $('.cf-table-add-row').click(function(){
     UpdateDynamicCheckbox('q17','qty','36','q35');              
	});
   $('#q17.cf-table-block tbody').on('click','.cf-table-delete',function(){
     UpdateDynamicCheckbox('q17','qty','36','q35');              
	});
});

The code will read one input field in one table and populate a checkbox in the second table with its Value.

 

When one of the dynamic checkbox's are selected the idea behind the code is that it will append a multi-line text field with the email address. You should be able to route and generate custom emails for your parts this way.

 

Just make sure you update the CSS classes and field ID numbers accordingly.

 

Any questions let me know.

Aaron

1 0
replied on June 12, 2018

Hi Ziad, it's a shame we live on opposite sides of the world as you do come up with some interesting request. So is the Non Stock items Table, I see that more lines can be added (Add) Dynamically , so your Select Parts would need to be Dynamic as well, correct? How are you doing that? As I expect that all of this needs to be tied together?

0 0
replied on June 12, 2018

Hi Steve,

 

I know right! although it is good collaborating on here with you. You are correct in saying that, as it was a requirement from the client, in case they miss a part or it needs to be added to the list. 

I am yet to decipher that part as well, as it will tie up to the solution as a whole. Need to find a way that will also enable me to the checkboxes dynamically based on lines. 

 

As we say here, fun and game :) 

Thanks Steve,

Ziad 

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.