0

我的网络有一个小问题。我在外部文件中有表格，如下所示。

<form action="/action.php" method="post" id="formularz_dodaj" target="iframe_id">
    <fieldset>
        <input type="hidden" name="ac" value="groups_save" />
        <ul>
            <li>
                Some fields here
            </li>
            <li class="buttons">
                <input type="submit" class="zapisz" value="Zapisz" />
                <input type="button" class="anuluj" value="Anuluj" />
            </li>
        </ul>
    </fieldset>
</form>
<script type="text/javascript">
    //<![CDATA[
    $j('.zapisz').button().click(function(){
        $j('.anuluj').hide();
    });
    $j('.anuluj').button().click(function(){
        $j('#dialog').dialog('close');
    });
    //]]>
</script>

如您所见，除了按钮之外没有什么特别之处。结果表单通过 jQuery 获取样式按钮。按钮<input type="submit" class="zapisz" value="Zapisz" />应该像正常提交一样工作，<input type="button" class="anuluj" value="Anuluj" />应该只是关闭对话框。此表单通过 jQuery ajax() 方法放置在对话框中，如下所示：

var $j = jQuery.noConflict();
var main = new Object();

$j.extend($j.ui.dialog.prototype.options, {
modal: true,
resizable: false,
width:'auto',
height:'auto',
show:{
    effect:'fade',
    duration:'fast'
},
hide:{
    effect:'fade',
    duration:'fast'
},
open:function(){
    $j(this).find("input[type=text], input[type=password], input[type=checkbox],     select, textarea").uniform();
}
});
main.dialog = function(ob){
if(ob.url){
    var url = arguments.url;
    var dialog = $j("#dialog");
    if ($j("#dialog").length == 0) {
        dialog = $j('<div id="dialog" class="dialog" title=""></div>').appendTo('body');
    }
    if(ob.title){
        dialog.attr('title', ob.title);
    }
    $j.ajax({
        type:'POST',
        dataType:'html',
        data:ob.dane,
        url:ob.url,
        success:function(d){
            if(d == 'uprawnienia'){
                main.alert({
                    text:'Nie posiadasz uprawnie\u0144 do tej operacji.', 
                    title:'Brak uprawnie\u0144'
                });
            } else {
                $j("#dialog").html(d);
                $j("#dialog").dialog({
                    title:$j("#dialog").attr('title')
                });
            }
        },
        error:function(){
            alert('Niepoprawne rz\u0105danie.');
        }
    });
} else {
   alert('Brak pliku do za\u0142adowania.');
}
}

数据的目标是放置在主索引文件中的 iframe。

<iframe name="iframe_id" id="iframe_id" src="" style="display:none; width:400px; height:200px;"></iframe>

当我使用带有“.zapisz”类的按钮时会发生什么，在特定浏览器中没有任何反应：IE8、Chrome、Safari。在 IE9 和 FireFox 中，它可以正常工作。

我已经在我的任何浏览器中检查了控制台，并且没有错误。没有来自表单的数据发送到 iframe。只执行 click 方法中添加的 JS。

按钮“.zapisz”仅在document.getElemntById('formularz_dodaj').submit();以单击功能编写时才能正常工作。

任何人都知道有什么问题吗？

4

5 回答 5

1

把它包在里面

$(function(){
//your code here
});

它应该工作！

如果仍然不起作用，请删除 .button() 并尝试

$(function(){
    $j('.zapisz').click(function(){
        $j('.anuluj').hide();
    });
    $j('.anuluj').click(function(){
        $j('#dialog').dialog('close');
    });
});
于 2013-01-09T08:25:33.427 回答
0

试试这个方法：

$("document").ready(function() {
    $j('.zapisz').click(function(){
        $j('.anuluj').hide();
    });
    $j('.anuluj').click(function(){
        $j('#dialog').dialog('close');
    });
});

问候。

于 2013-01-09T08:26:54.700 回答
0

是看到表单的目标是target="iframe_id"。您的页面中是否有任何隐藏的 iframe，因此提交已完成，但您无法“看到”它。

@ATOzTOA 给出的答案工作得很好，但它在新选项卡中打开。因此，您的页面中可能有一个隐藏的 iframe，并且表单的目标是

编辑

您的 iframe 具有名称和 id upload，但您的目标是iframe_id. 尝试将您的表格更改为

<form action="/action.php" method="post" id="formularz_dodaj" target="upload">
于 2013-01-09T09:14:25.317 回答
0

因为这种行为没有解决方案或明确的原因，所以我建立了一些解决方法。因为所有对话框（在我的情况下）都包含按钮类.zapisz和/或.anuluj它们的用法在每种情况下都是相同的，所以我预定义了这样的代码：

$j.extend($j.ui.dialog.prototype.options, {
    modal: true,
    resizable: false,
    width:'auto',
    height:'auto',
    show:{
        effect:'fade',
        duration:'fast'
    },
    hide:{
        effect:'fade',
        duration:'fast'
    },
    open:function(){
        $j(this).find("input[type=text], input[type=password], input[type=checkbox], select, textarea").uniform();
        $j(this).find('input[type=submit], input[type=button]').button();
        $j(this).find('.zapisz').each(function(){
            $j(this).click(function(){
                $j(this).parents('form').submit();
                $j(this).parents('form').find('.ui-state-error').hide();
            });
        });
        $j(this).find('.anuluj').each(function(){
            $j(this).click(function(){
                $j(this).parents('.dialog').dialog('close');
            });
        });
        $j('.ui-icon.ui-icon-closethick').on('click', function(){
            $j(this).parent().parent().hide();
        });
        $j(this).find('.ui-state-error').hide();
        $j('span.opis').tooltip();
    }
});

此代码的作用是（省略效果等基本设置）当打开对话框时，它会搜索具有 thosw 类的按钮.zapisz和/或.anuluj并根据父级为它们提供适当的操作。因此，现在无需手动添加submit()到我拥有的每个表单中。

接下来是当我需要向这些按钮中的任何一个添加一些其他操作时，我只需将它们写入表单本身，就像这样：

$j('.zapisz').click(function(){
    $j('.anuluj').hide();
    $j(this).val('Wysy\u0142am dane');
    $j(this).attr('disabled', 'disabled');
});

button()请注意，在添加之前不再有方法click()。

现在我有了按我想要的格式设置的对话框，并且默认情况下可以按预期工作。

我仍然不知道为什么我的问题会发生在某些浏览器中，所以如果你有任何关于它的信息，那对未来会很好。

于 2013-01-10T09:23:51.930 回答
-1

一个问题：/action.php将尝试加载action.php位于文件系统的根目录中。你应该使用./action.php.

这在 Chrome、Firefox 和 IE6 中运行良好：

<form action="./action.php" method="post" id="formularz_dodaj" onsubmit="alert('Submitting form');" target="iframe_id">
    <fieldset>
        <input type="hidden" name="ac" value="groups_save" />
        <ul>
            <li>
                Some fields here
            </li>
            <li class="buttons">
                <input type="submit" class="zapisz" value="Zapisz" />
                <input type="button" class="anuluj" value="Anuluj" />
            </li>
        </ul>
    </fieldset>
</form>

<script type="text/javascript">
    $('.zapisz').click(function(){
        $('.anuluj').hide();
        return true;
    });

    $('.anuluj').click(function(){
        $('#dialog').dialog('close');
    });
</script>
于 2013-01-09T08:30:05.933 回答