从Ajax POST将数据库中的复选框值保存为0或1

时间:2013-10-02 01:01:22

标签: javascript jquery mysql ajax

所以我在数据库中有几列我已配置为TINYINT。我的前端也有相同数量的复选框。

这是我的HTML,

<script type="text/x-handlebars" id="project">
    <div class="row">

        <div class="span6">
            <div class="well well-small">
                <p style="text-align: center">
                    You can create a new Project by filling this simple form.
                </p>

                <p style="text-align: center"> Project Name should be minimum 10 characters & There's no limit on
                    Project Description.
                </p>
            </div>
            <form class="form-horizontal">
                <div class="control-group">
                    <label class="control-label" for="projectname">Project Name: </label>

                    <div class="controls">
                        <input type="text" name="projectname" id="projectname" required
                               title="Project Name is Required!" pattern="[A-z ]{10,}"
                               placeholder="Enter Project Name"/>
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label" for="projectdesc">Project Description:</label>

                    <div class="controls">
                        <textarea rows="3" id="projectdesc" name="projectdesc" placeholder="Enter Project Desc"
                                  required="Description Required"></textarea>
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label">Roles:</label>

                    <div class="controls">

                        <label class="checkbox">
                            <input type="checkbox" name="roles" id="script" value="false"> Script
                        </label>
                        <label class="checkbox">
                            <input type="checkbox" name="roles" id="design" value="false"> Design
                        </label>
                        <label class="checkbox">
                            <input type="checkbox" name="roles" id="writer" value="false"> Writer
                        </label>
                        <label class="checkbox">
                            <input type="checkbox" name="roles" id="storyboard" value="false"> Storyboard
                        </label>
                        <label class="checkbox">
                            <input type="checkbox" name="roles" id="workbook" value="false"> Workbook
                        </label>
                        <br>
                        <button class="btn"
                        {{action 'createNew'}}>Add Project</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</script>

这就是我在做什么,

           function(event) {
            $(":text, input[type='checkbox'], textarea").each(function() {
                if ($(this).val() === "") {
                    alert("Empty Fields!");
                    event.preventDefault();
                } else {
                    App.Project.createNew();
                    alert("Project Created");
                    event.preventDefault();
                }
            });
        }

和Ajax POST,

            dataString = {
            'projectname' : $("#projectname").val(),
            'projectdesc' : $("#projectdesc").val(),
            'script' : $('input.roles[type="checkbox"]:checked', this).val()
        };
        console.log('check');
        $.ajax({
            type : "POST",
            url : "http://ankur.local/users/createNewProject",
            data : dataString,
            dataType : "json",
            success : function(data) {
                console.log('success');
                alert('');
            }
        });
        return false;

你可以从我的代码中看到我试图获取文本框的已检查值,我希望将其存储在数据库中为0或1,或者也许是True或False?此外,我希望条件超出给定的复选框,至少应检查一个。

'script' : $('input.roles[type="checkbox"]:checked', this).val()

我如何实现目标?

1 个答案:

答案 0 :(得分:0)

选中至少检查一个复选框的条件

if($('input[type="checkbox"]:checked').length > 0)
{
  //do your work
}else
{
 alert("Please check any checkbox");
return false;
}

在发布数据之前进行检查。

获取保存在数据库中的值

  //will give the value attribute of selected checkbox
    // true/false in this case
    var value = $('input[type="checkbox"]:checked').val();

//for getting value in 1 or 0 from the above variable.
 var value1 = value ? 1 : 0;

用于保存所有复选框值。

var all_values= "";
$('input[type="checkbox"]').each(function(){
var value = $(this).is(":checked") ;

all_values = all_values + "~" + value ;
});

将all_values的值发送到您的代码,使用split来获取所有值。