How to validate HTML Input?

[Harsh]

Hello there!
I was added one new html input in my DFFS form header and i want to use this input box for Title(require column) of List.
I was put this Input box in header section because i want to put this at very top along with some design and background.
Now, I want to validate this input box when user click on save button, I was simply hided Title fields that i was add through form.

So, how can i validate this input box on save, also how can i remove error message?

Code on header:
<input type=”text” id=”newProjectTtl”></input>

[Alexander Bautz]

Hi,
You must use some custom js – like this example:

function dffs_PreSaveAction() {
    var projectTitle = jQuery("#newProjectTtl").val();
    if(projectTitle === ""){
        jQuery("#newProjectTtl").css({"background-color":"#fde7e9"});
        spjs.dffs.alert({
            "title": "Missing project title",
            "msg": "Please supply the title of the project in the highlighted input field.",
            "ok": function(){
                // close dlg
            }
        });
        return false;
    }
    return true;
}

I’m not sure what you mean by “how can i remove error message” – please clarify.

Let me know if you have any questions.

Alexander

[Harsh]

Thanks for reply Alexander,

But some how i can not call this method while clicking save button,
Let me explain this again,
Please find attached image, i am using one header on form and i want title field into this header, I can not move my OOTB title field into header, i am correct?
so, i just simply create one input box in header.
In custom js i write code to hide OOTB title.

function dffs_Ready() {
$('#dffs_Title').hide();
$('#newProjectTtl').on('change', function () {
        $('#dffs_Title').find('input').val(this.value);
    });
//other codes
};

So, now when i try to save form without entring title into this field, it will not save the form, so at this time i want to validate my custom input box along with error message just like OOTB title error message.

I tried below code but it is not working, can you please help me with this?

function dffs_Ready() {
$('#dffs_Title').hide();
$('#newProjectTtl').on('change', function () {
        $('#dffs_Title').find('input').val(this.value);
    });
//other codes
};
function dffs_PreSaveAction() {
    alert("pre save call");
    var projectTitle = jQuery("#newProjectTtl").val();
    if(projectTitle === ""){
        jQuery("#newProjectTtl").css({"background-color":"#fde7e9"});
        spjs.dffs.alert({
            "title": "Missing project title",
            "msg": "Please supply the title of the project in the highlighted input field.",
            "ok": function(){
                // close dlg
            }
        });
        return false;
    }
    return true;
}

Thanks.

• This reply was modified 3 years, 4 months ago by Harsh.

Attachments:

1. 

   Untitled.png
   

[Alexander Bautz]

The problem is that the Title field is required – and the built in validation of all required fields are performed before the dffs_PreSaveAction function is triggered. When a field is empty, the function will never be triggered.

This means you must either remove the required flag on the title field in your list settings, or you must add a dummy / placeholder value to the Title field on form load – something like this:

setFieldValue("Title", "...");

Alexander

[Author]

Posts