Questions and discussion about developing processes and programming in PHP, JavaScript, web services & REST API.

Moderator: amosbatto

Forum rules: Please search to see if a question has already asked before creating a new topic. Please don't post the same question in multiple forums.
By edward
#790295
I have a dynaform(master-form) made up of several sub-forms

Each sub-form has its own javascript code which runs very well, when executing each sub-form independently.

Unfortunately, the javascript in the sub-forms do not work, when running the whole master-form.
By mishika
#790297
Hello,

What exactly in the javascript code is not working?
When we include a subform in a Dynaform, the subform's javascript becomes read-only as it gets concatenated with the main Dynaform's javascript. Might be the javascript for both the forms are clashing at some point and as a result not working properly.
May you please export your process or the Dynaforms so that it can help us debug the problem?

Best Regards
Mishika
By edward
#790299
Hello!

Just a very simple javascript which sum grid column.

We want to persist into database, grid column sum for further use in an output document.

I have attached two files
1. One sub-form
2. One Master-form which has several sub-forms.

Thanks
Attachments
Master form
(44.1 KiB) Downloaded 83 times
Sub form
(5.34 KiB) Downloaded 77 times
By mishika
#790302
Hello,

The issue you are facing here, i.e. the javascript of a subform does not work properly on the master form, is because of the javascript code used there.
The javascript code includes the event handler on the form, i.e.:
Code: Select all
$("form").setOnchange(function(field, newVal, oldVal) {.....});
which is not in a working state right now in ProcessMaker for the subforms.
This results in a problem that the grids cannot interact with the text fields through javascript when placed in a subform.
This has already been reported as a bug and will be resolved soon.

Here is a workaround for your requirement(fetch the sum calculated for the column 'Estimate Cost Shs' in a text field).
Take a button, on click of which the total is fetched from the sum function, which calculates the sum.

The only javascript code that needs to be placed in the subform is:
Code: Select all
function sum() {
  var total = document.getElementById('sum-gridSalaryProvide-provideEstimateCost').value;
  $("#provideEstimateSum").setValue(total);
}
document.getElementById("getsum").onclick = sum;  
where getsum is the id of the button and 'sum-gridSalaryProvide-provideEstimateCost' is the id of the input field that stores the sum value.
You need not add any javascript to the master form. The javascript from the subform automatically concatenates with it.

You can refer the subform attached here:
(5.08 KiB) Downloaded 83 times
Hope this helps

Best Regards
Mishika
By edward
#790305
Hello!

It works very well.

Is "sum-gridSalaryProvide-provideEstimateCost" a system generated ID for SUM text control? If so, what is the variable name related to this ID? I just want to retrieve and display SUM value from the database when displaying grid data on an OUT PUT DOCUMENT.

From this link http://wiki.processmaker.com/3.0/Output ... _documents, we can find how we can display grid data on an OUT PUT DOCUMENT, but does not tell how we can show aggregate value like SUM, AVG which was previously computed when creating a dynam-form.

Thank you for your support
By mishika
#790307
Hello,

Yes, "sum-gridSalaryProvide-provideEstimateCost" is a system-generated ID for the sum function we use for grid's column.
You can refer the attached screenshot to get the idea of where this ID has come from.
sum value.png
sum value.png (46.24 KiB) Viewed 2622 times
If you want to show the sum or the aggregate in the output document, you can simply use the value stored in the text control @@provideEstimateSum.
In your output document directly use the variable @@provideEstimateSum wherever you require displaying the sum, as the calculated sum has been set as the value of this variable in the javascript of the form.

Hope this helps

Best Regards
Mishika
By edward
#790310
Hello once again!

The variable "provideEstimateSum" is user-defined-variable. I think creating another variable for SUM sounds like re-inventing the wheel.

What if I just want to pull the SUM based on system defined variable for SUM function declared by this symbol ∑: in a span control?

Thanks
By mishika
#790394
Hello,

If you want to access the SUM of the column anywhere other than the Dynaform then you will have to store it in a variable first.
You cannot access it through javascript in an output document. Nor the value of the sum is stored in some system variable so as to be accessed globally in the process.
Here, you are getting the value of sum through a javascript function and to make it globally accessible in the process, you will have to store it in a case variable.
Once you have it in a case variable, you can directly use the variable in Output Document (using @@).
In context to the above-discussed posts, you are storing the sum in a variable named @@provideEstimateSum, which can be done in the javascript using the following code:
Code: Select all
var totalCost = parseFloat($("#grid-id").getSummary("column-id"));
$("#provideEstimateSum").setValue(totalCost);
And @@provideEstimateSum being a case variable can be accessed in the Output Document.

Hope this helps.

Best Regards
Mishika
By edward
#790397
Hello Mishika!

Well, I got it and have implemented already it works

Here is the code snippet

Code: Select all
$(document).ready(function(){
  
	$("#473591540585782e19901d9068096705").setOnchange(function(field, newVal, oldVal) {
      	var total = document.getElementById('sum-gridSalaryProvide-provideEstimateCost').value;
      	//var total = $("#gridSalaryProvide").getSummary("sum-gridSalaryProvide-provideEstimateCost");
      	var totalCost;
      	if (isNaN(total)){
        	totalCost = '';
        }else{
        	totalCost = parseFloat(total);
      	}      	
		$("#provideEstimateSum").setValue(totalCost);
      	alert(totalCost);
	});
  
});
Unfortunately, this code is in one of the sub-forms, therefore it wont work on a master form. Please not I have one Submit button on the master form which submits all forms(master+sub-forms) content.

In which form event do I need to include the logic that assign SUM to "provideEstimateSum" variable?

Thanks

Edward
By mishika
#790409
Hello,

As I had mentioned earlier, in the post: viewtopic.php?f=44&t=710350#p790302
that using $("form").setOnchange() will not work for a subform when used inside a master form.
The workaround I had suggested was to use a button, on click of which the value of the sum will be stored in the variable @@provideEstimateSum.
The javascript code for this to be included in the subform can be:
Code: Select all
function sum() {
  var total = document.getElementById('sum-gridSalaryProvide-provideEstimateCost').value;
  //var total = $("#gridSalaryProvide").getSummary("provideEstimateCost");		to use grid.getSummary() function use this line and comment out the above line.
  $("#provideEstimateSum").setValue(total);
}
document.getElementById("getsum").onclick = sum; 
This button should not be of type submit. It should be a simple button, so it will not affect any other form data.
The submit button you need(to submit all the form's data) can be included in the end of the master form, which will submit all the data of master form as well as the subform.

Hope this helps

Best Regards
Mishika
By edward
#790414
Hello !

It's working now.

Here is the code
Code: Select all
function roundToFixed(_float, _digits){
  var rounder = Math.pow(10, _digits);
  return (Math.round(_float * rounder) / rounder).toFixed(_digits);
}

function sum() {
  	//var total = document.getElementById('sum-gridSalaryProvide-provideEstimateCost').value;
    var total = $("#gridSalaryProvide").getSummary("provideEstimateCost");
    var totalCost;
    if (isNaN(total)){
       	totalCost = '';
    }else{
      	totalCost = total  + 0.03*total ; 
        totalCost = roundToFixed(totalCost,2);
    }      	
  
    if(totalCost>0){          	
		$("#provideEstimateSum").setValue(totalCost);
    	// alert($("#provideEstimateSum").getValue()); // debug
    }
}


$(document).ready(function(){
  	// update sum 
  	// on save button clicked
	document.getElementById("provideSave").onclick = sum;  
  
  	// update sum 
    // on submit master form 
  	// just in case user forget to save
  	var formId = $("form").prop("id");
  	getFormById(formId).setOnSubmit( function() {
    	sum();
	});
});

I have also included a logic(which listens for setOnSubmit event on form object) to update "provideEstimateSum" variable just in-case user forget to click save button.


Thanks alot.

Regards,
Edward
User avatar
By amosbatto
#790420
By the way, it is possible to set the event handler inside a subform when you are using JavaScript code in the master DynaForm. You just need to know the unique ID of the subform. See:
http://wiki.processmaker.com/3.0/JavaSc ... r_controls
http://wiki.processmaker.com/3.0/JavaSc ... n_subforms

Inside the master DynaForm, you can use code like this:
Code: Select all
$("#25740450558f956845b36a3042813533").find("#clientAddress").setOnchange( function(newVal, oldVal) {
   alert(newVal);
});
ProcessMaker 4

Hi everybody, Thanks for your interest in the pub[…]

HOW TO INCLUDE THE GULLIVER PHP

My Problem: 1. How to include the gulliver php in […]

VS CODE AND GITLAB

Hi Guys,. there's anyone tried to use gitlab and v[…]

I need help regarding when I click "Case Note[…]