disable save button after clicked

[kevinwen]

Hi,

I want to use javascript to disable the the save button in the new/edit form after the button is clicked to prevent duplicates from happening. How do I add the onclick event to the save button. I know that this button is created in the QuickForm. Thanks.

[shannah]

Use one of the blocks on the edit form to insert some javascript. JQuery would make it very easy to attach such a handler to the save button.

[kevinwen]

I know there are some blocks available after the save button like block_after__widget() for me to insert the javascript. However, the save submit button itself looks like the following and doesn't have the onclick event defined:

Code: Select all

<input type="submit" value="Save" name="--session:save">

How do I bind an onclick event to this button after this form element is rendered? can you show me the example how to use it or how to use JQuery to get it done? I'm not familiar with JQuery. Thanks.

[shannah]

Here's the javascript code. You could save this in a file called submithandler.js.

Code: Select all

jQuery(document).ready(function($){
    $("input[type='submit']").click(function(){
        $(this).attr("disabled","disabled");
    });
});


Then add this to any block on the page.

Code: Select all

function block__xxx(){
    echo '<script type="text/javascript" src="submithandler.js"></script>';
}


[amrcode1]

good idea, but don't work for me, i add custom js in Aplication Class, but when i click Save button this don't change to disabled
i have xataface 1.2.2

[shannah]

Check for javascript errors in your browser to see why it isn't working.

[amrcode1]

Ok, the system is on my work, but the new record form work fine, record was saved, i'm use FF 3 and i don't see error messages from js

[shannah]

Firefox 3 shows errors Under Tools > Error Console.
Safari is another really good one for debugging if you enable the develop menu. (http://www.macosxhints.com/article.php? ... 0063041629)

[amrcode1]

Hi, i try use this tip on html/static page, and work fine, i can see buttons disabled, but i don't know why don't work with xataface, possible plone_register js function???

[shannah]

Until you look at an error log to find out what went wrong you will be spinning your wheels on this one.

[amrcode1]

Hi, this error is from xataface system when button don't change, i'm follow you instruccion, add js.file, add custom_javascript in Aplication_class and when i load any page of this system i can see this error on my consolo in FF, curiously this "error" don't happen in html/statis form file

Error: $ is not defined
[Source File][Archivo de origen]: https://x.x.x.x/db/PD/submit.js
[Line][Línea]: 1,

[shannah]

OK.. Can you show your code (just the block that you inserted). I think I know what's going on.

[amrcode1]

function block__custom_javascripts(){
echo '<script src="javascripts.js" type="text/javascript" language="javascript"></script>';
echo '<script src="submit.js" type="text/javascript" language="javascript"></script>';
}

[shannah]

Can you show the javascript in these files also.

[amrcode1]

[submit.js]
<script type="text/javascript">
jQuery(document).ready(function($){
$("input[type='submit']").click(function(){
$(this).attr("disabled","disabled");
});
});
</script>
[]

[javasvript.js]
function nextField(field,nextfield){
    if ( field.value.length == 1 ){
        document.getElementById(nextfield).focus();
    }
}
[]


PD: now i can see other message error of console:

Error: missing } in XML expression
[source file]Archivo de origen: https://x.x.x.x/db/PD/submit.js
[line 5, crow 3]Línea: 5, columna: 3
[Código fuente][source code]:
});