Jquery Issue in Appending Text to a label - javascript

I was doing validations for input fields using Jquery by just checking if a value is supplied for the fields or not.
In case there is NO value supplied, I just used to Append Text: "Duration:*Required" to the Field's "Label" controls as:
$('label[for="Duration_Value"]').Append(" Duration:* Required");
The problem is that for the very first time, if a user doesn't selects a value for the "Duration" dropdown, error message displays fine.
But, again , without selecting any value, if the Submit button is subsequently clicked, the Error Message: "Duration:* Required" keeps adding at end as seen below:
Which Jquery function shoul be used to change Text / error message displayed so that no matter how many times submit button clicked, Error message don't add up as above ?

Use indexOf to check if the message is already added, if not then only add the message to the label.
if ($('label[for="Duration_Value"]').text().indexOf(" Duration:* Required") === -1) {
$('label[for="Duration_Value"]').append(" Duration:* Required");
}

If value is not specified, then call this
$('label[for="Duration_Value"]').text(" Duration:* Required");
and if value is specified then clear label text like this
$('label[for="Duration_Value"]').text("");

Related

Editable Subgrid setting the required field from onchange event broken

We were using this snippet on an editable subgrid in a form, while one of the attribute trigger onchange event triggering this function and the necessary fields were marked as required so far. So users cannot save the editable subgrid row and autosave will also get blocked with a notification message.
Suddenly it stopped working now and no errors or exceptions while debugging, though the field is marked as required from onchange function - still users are able to save the record without value in required field. No clue why this behavior change is observed now.
Anyone else faced this issue and any workaround for this?
function ReasonChange(eContext) {
debugger;
// get the attribute which fired the onchange.
var reasonAttr = eContext.getEventSource();
// get the container for the attribute.
var attrParent = reasonAttr.getParent();
// get the value of the reason.
var reason = reasonAttr.getValue();
if (reason != null) {
// var field1 Attribute
var field1 = attrParent.attributes.get("new_followupdate");
//Callback
if (reason[0].id == "{33E9E459-5A8B-EA11-A812-000D3A5A17E3}") {
// set field as mandatory.
field1.setRequiredLevel("required");
}
else {
//clear field value
field1.setValue(null);
// set field as mandatory.
field1.setRequiredLevel("none");
}
}
One workaround i could think now is to add code on Onsave event and check if field value contains data if not show error message.
Also, have you checked in other browser if the behavior is same or different?
Please mark my answer verified if i were helpful

use javascript set value to input ,the input value will disappear when it's on focus

i have try to fill some value into input field by javascript(chrome extension)which belong to a form , the value seems not update, and will disappear when i click the other area of the page ,
my code is simple
document.getElementById("editGiftCardNumber").value = "12345";
document.getElementById("editGiftCardNumber").setAttribute('value','12345');
also try to use
setTimeout(function()
e.g. in https://www.elementaryrobotics.com/
, i try to set value in chrome console
input = document.getElementById("comp-jpua0zn5input");
input.value="123";
you will see the 123 is shown in input, if I click other area of the page, the 123 will disappear, how to solve it ?

jQuery form validation. How to prevent error messages appearing multiple times

I'm trying to validate a form in jQuery. I have it working, with 1 issue. If i click the submit button twice, the error messages will show twice, stacked on top of eachother.
EG
Name must not be empty
Name must not be empty
//Form Validation
//Store checkbox, and checkbox label in jQuery object
$terms = $('#terms');
$termsdoc = $('#terms-doc');
//Check if pet name is empty
if($name.val() == '')
{
$name.after('<p class="error">Name must not be empty</p>')
}
if($terms.is(':not(:checked)'))
{
$termsdoc.after('<p class="error">Please agree to the terms and conditions</p>')
}
Using .last() just adds the desired content as the last child of the target selection, so what you're seeing is a duplicate element being added.
SOLUTION:
You could target <p> tags with the class "error" and remove them before you add them with .last():
$("p.error").remove();
You could also disable the submit button in the handler. $(".submit").prop("disabled",true);
This would prevent duplicate submissions.

Hiding a Section on Dynamics 365 using JS

I'm trying to take a field value (that's a two option check box) and if it is checked then set the visibility on a section to be true, and if it's not checked then to set the visibility to false. I have it set on the field to call the function on an on change event.
When I go into the form and either check the box or uncheck the box it gives me a script error.
This is the function I'm using:
function SetProductVisible(){
if (Xrm.Page.getAttribute("ee_productspecific").getValue()){
Xrm.Page.ui.tabs.get(“SubGrids”).sections.get(“Products”).setVisible(true);
}
else{
Xrm.Page.ui.tabs.get(“SubGrids”).sections.get(“Products”).setVisible(false);
}
};
Thank you for your help.
The fields default value is also set to "No"
Ensure that you are using the right quotation marks by replacing “ and ” with ".
As mentioned in the comments, also ensure that you are using the right name for your tab and section, and check the developer console for more information about the error.
here is your solution...
I created a new field on the CRM form called "log_showhide" which is a two option field. You need to edit the code below to match your Section name and field name with the correct values...
Furthermore, I would set the code to run on load of the form as well as on change of your field.
This method is applicable to Microsoft Dynamics 365 v9.x
function hideOrShow(executionContext){
var a = executionContext.getFormContext().getAttribute("log_showhide").getValue();
if (a == 0) {
Xrm.Page.ui.tabs.get("SUMMARY_TAB").sections.get("sampleSection").setVisible(true);
} else {
Xrm.Page.ui.tabs.get("SUMMARY_TAB").sections.get("sampleSection").setVisible(false);
}
}
Rather than doing a custom web resource to show/hide a field or section, I would recommend you go with a Business Rule. With a Business Rule you can set up a simple check of the value of one field and hide other fields based on that.
Another way to hide a section by field's parent. Just refer a field on that section:
function SetProductVisible()
{
var some_section = Xrm.Page.getControl("new_field_on_that_section_name").getParent();
some_section.setVisible(Xrm.Page.getAttribute("ee_productspecific").getValue());
};

I need help understanding a simple JavaScript script

if(document.frmMain.POL_NO.value == "")
{
alert("Select Policy Number");
document.frmMain.ENDT_NO.value="";
document.frmMain.POL_NO.focus();
return false;
}
Can anyone explain the above code to me? I am new to Javascript.
It appears to be a bit of validation code to make sure a user has entered a value for an item referred to as "Policy Number". It is the sort of code that gets called when submitting a form to check that the values the user has entered are valid.
In detail:
if(document.frmMain.POL_NO.value == "")
Only run this code if the item called in POL_NO the form called frmMain doesn't have a value yet.
alert("Select Policy Number");
Display a message to tell the user that they need to enter a value.
document.frmMain.ENDT_NO.value="";
Set the ENDT_NO item of frmMain to a blank value.
document.frmMain.POL_NO.focus();
Set the focus to the POL_NO item (the same as the user tabbing to it or clicking on it).
return false;
Return false to the code that called the function that this code is in. If this code is used in the event handler for the submit button on a form then returning false will stop the form from being submitted to the server until the POL_NO item has a value.
If the contents of the item POL_NO from the form frmMain is empty, then throw an alert and change the value of the ENDT_NO item value to nothing (empty) and after that focus on the element POL_NO. Return false after that (I assume this code executes at onSubmit event, so the form won't be submitted if POL_NO doesn't have a value)
Probably the logic is that the ENDT_NO can't have a value if POL_NO is empty.
Enjoy!
document.frmMain is a form in the page, and POL_NO and ENDT_NO are fields in the form, presumably listboxes.
This code is a simple validation script to make sure you filled out the form correctly.
//if POL_NO hasn't been set (no policy number selected):
if(document.frmMain.POL_NO.value == "")
{
//show a message box
alert("Select Policy Number");
//clear the value (if any) of ENDT_NO
document.frmMain.ENDT_NO.value="";
//set the form focus to POL_NO (select it, as if you had clicked on it)
document.frmMain.POL_NO.focus();
//stop the form from being submitted
return false;
}
I'm assuming this code is part of a function which is called by frmMain's onSubmit event (and event handler) -- when the function returns false the submit is cancelled. Were this not here, it would show the message box, clear ENDT_NO, select POL_NO and then submit anyways.
Note that referencing members of a form in the document.formName.fieldName.property fashion is deprecated. The correct way is to use getElementById or a similar function:
document.frmMain.ENDT_NO.value = ""; //bad
document.getElementById("ENDT_NO").value = ""; //correct
HTML document
your HTML document has this defined somewhere in its content
<form id="frmMain" ...>
<input type="..." id="POL_NO">
<input type="..." id="ENDT_NO">
</form>
SCRIPT code
So. Your script checks whether your POL_NO input field has a value.
If it doesn't (it's an empty string),
it displays an alert (information window) and
empties ENDT_NO field's value and
puts focus on the POL_NO field - so the user can immediately start selecting/typing a value in this field
returns false - probably to cancel form submission
Business logic
Based on the logic of this script, the business process obviously doesn't allow any value in ENDT_NO field, until there's a value in POL_NO.
Observation
If you need to change something about this code (if there's a bug in it), I strongly suggest you get to know Javascript/DOM/HTML before doing any changes.
Actually your code does a pretty simple validation, just read the code and find the fields POL_NO and ENDT_NO in your HTML output. Here is my comments :
// if your POL_NO field is empty,
if(document.frmMain.POL_NO.value == "")
{
// warn user that he need to select Policy number
alert("Select Policy Number");
// set ENDT_NO field's value to empty
document.frmMain.ENDT_NO.value="";
// set POL_NO active - focussed
document.frmMain.POL_NO.focus();
return false;
}
If the value of the input named POL_NO in the form frmMain is empty, then show a message "Select Policy Number", empty the input named ENDT_NO, give the focus to the input named POL_NO, and the exit the function with the return value "false".

Categories

Resources