Question

我正在为铁路围场审计建立一个表格。这涉及一个bootstrap popover，其中包含一个textarea，审计员可以在其中添加注释。选中html复选框后，将激活弹出窗口。所有这一切都运行正常，但现在最终用户想要一个警报，如果选中复选框并且弹出文本区域中没有注释。在大多数情况下，我创建了一个javascript变量，它从表单中获取信息，然后提醒最终用户更正错误，或者如果所有内容都检出则提交表单。

<!doctype html>

            <head>
            <meta charset="utf-8">
            <meta http-equiv="X-UA-Compatible" content="IE=edge">
            <meta name="viewport" content="width=device-width, initial-scale=1">
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
        <script src="js/bootstrap.min.js"></script>


        <meta charset="utf-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />


            </head>
            <body>
            <FORM METHOD="POST" NAME="mainForm" onsubmit="return checkform()" action='process_rail_tally_form.php' style='max-width: 125em; min-width: 125em;'>



            <script>
            function checkform() {

            var zz = document.forms["mainForm"]["exempt"].value;
            var zy = document.forms["mainForm"]["exempt_com"].value;


            if ((zz.checked) && (zy == null || zy == "")) {
            alert("You have checked handling changed with rep present. Please enter some comments.")

            }

            else {

            alert("Thank You! To continue submitting your form click leave this page.");
            return true;
            }
            }
            </script>
            <table width='50%' align='center' BORDER='0' bordercolor='lightgray' CELLPADDING='0' CELLSPACING='0' STYLE='font-family: tahoma; font-size: 8pt; padding-left:10px; padding-right:0px;'>
            <script type="application/javascript">

            $(document).ready(function() {
            $('#C1').change(function() {
            if($(this).val()=="OTHER"){
            $( "#comment1" ).hide();


                }
            if($(this).val()!="OTHER"){
            $( "#comment1" ).show();
                }
                });
            $("#Show_Upload").click(function(){
            $("#div-box").toggle();
                });
            $('#fadeslow').fadeIn('slow');
            $('[data-toggle="popover"]').popover({ 
                html: true,
                });

                });
            </script>
            <tr>
            <td>
            <a href='#'  role='button' data-toggle='popover' data-trigger='click' data-content="<textarea maxlength='2000' name='exempt_com'  rows='5' cols='40'></textarea>" title='Comments' style="font-size:8pt; !important;"><input name="exempt" type="checkbox"></input></a>
            </td>
            </tr>
            </table>      
            <center><input type="submit" style="color: black; font-size: 12pt" name="submit" value="Submit"/></center>
            </form>
            </body>
            </html>

如果bootstrap popover为null，则为Javascript警报

0 个答案: