How can I assign an HTML5 data value to an element?
<p>I have the following code:</p>

<pre><code> $.modal({
                    title: title,
                    closeButton: true,
                    content: content,
                    complete: function () {
                        applyTemplateSetup();
                        $('#main-form').updateTabs();
                        $('#main-form').data('action',action);
                        // updated to line below but still does not work
                        $('#main-form').data('action','Edit');
                    },
                    width: 900,
                    resizeOnLoad: true,
                    buttons: {
                        'Submit': function (win) {
                            formSubmitHandler($('#main-form')); 
                        },
                    }
</code></pre>

<p>Once my data is loaded I am trying to set the data attribute action. I then have more code that reads it in the submit handler:</p>

<pre><code>var formSubmitHandler = function (form) {

    //e.preventDefault();
    var $form = form;
    var val = $form.valid();
    if (!$form.valid || $form.valid()) {

        var submitBt = $(this).find('button[type=submit]');
        submitBt.disableBt();
        var sendTimer = new Date().getTime();

        $.ajax({
            url: $form.attr('action'),
            dataType: 'json',
            type: 'POST',
            data: $form.serializeArray(),
            success: function (json, textStatus, XMLHttpRequest) {
                json = json || {};
                if (json.success) {
                    if ($form.data('action') == "Edit") {
                        $('#modal').removeBlockMessages()
                        submitBt.enableBt();
                    } else {
</code></pre>

<p>However it seems the value is not being set correctly as when I step through the code this is not getting a true value: <code>$form.data('action') == "Edit".</code> Am I doing something wrong?</p>
