Question

<form name="form_name" action="/" method="get">
          <% if params["title"].present?%>
            <% if params["title"] == "1" %>
            <input type="checkbox" name="title" onclick="this.form.submit();" value="1" checked> Title <input name="title" type="hidden" value="0" />
            <%else%>
            <input type="checkbox" name="title" onclick="this.form.submit();" value="1"> Title
            <%end%>

            <%else%>
             <input type="checkbox" name="title" onclick="this.form.submit();" value="1">Title
        <%end%> 
    <% if params["description"].present?%>
            <% if params["description"] == "1" %>
            <input type="checkbox" name="description" onclick="this.form.submit();" value="1" checked> Description <input name="description" type="hidden" value="0" />
            <%else%>
            <input type="checkbox" name="description" onclick="this.form.submit();" value="1"> Title
            <%end%>

            <%else%>
             <input type="checkbox" name="description" onclick="this.form.submit();" value="1">Title
        <%end%> 

    </form>

目标：拥有提交onclick的复选框，同时保留其他未经修改的复选框的状态

我有一堆复选框，点击它们时会提交表单。点击后，它们返回到同一页面，使用新的GET数据。上面的代码是一种黑客攻击，适用于一个复选框。但由于我这样做的方式，它不适用于多个复选框。

这似乎不是这样做的方式。我相信正确的答案是确定是使用javascript还是jquery选中或取消选中复选框。我对这些中的任何一个都不太满意，所以如果有人能指引我朝正确的方向发展......

Answer 1

问题是多余的隐藏输入，

      <form name="form_name" action="/" method="get">
        <% if params["title"].present?%>
          <% if params["title"] == "1" %>
            <input type="checkbox" name="title" onclick="this.form.submit();" value="1" checked> Title 
          <%else%>
            <input type="checkbox" name="title" onclick="this.form.submit();" value="1"> Title
          <%end%>
        <%else%>
            <input type="checkbox" name="title" onclick="this.form.submit();" value="1">Title
        <%end%> 
        <% if params["description"].present? %>
          <% if params["description"] == "1" %>
            <input type="checkbox" name="description" onclick="this.form.submit();" value="1" checked> Description 
          <%else%>
            <input type="checkbox" name="description" onclick="this.form.submit();" value="1"> Description
          <%end%>

        <%else%>
           <input type="checkbox" name="description" onclick="this.form.submit();" value="1">Description
        <%end%> 
      </form>

如果未勾选复选框，则意味着提交零值，但浏览器的好处是，它不会提交未经检查的复选框，<% if params["description"].present? %>这些条件会在不检查其值的情况下变为false。

在删除这些冗余条件后，更优化的代码是，

      <form name="form_name" action="/" method="get">
        <% if params["title"] == "1" %>
          <input type="checkbox" name="title" onclick="this.form.submit();" value="1" checked> Title 
        <%else%>
          <input type="checkbox" name="title" onclick="this.form.submit();" value="1"> Title
        <%end%>

        <% if params["description"] == "1" %>
          <input type="checkbox" name="description" onclick="this.form.submit();" value="1" checked> Description 
        <%else%>
          <input type="checkbox" name="description" onclick="this.form.submit();" value="1"> Description
        <%end%>
      </form>

保存复选框的状态onclick

1 个答案: