PHP registration form via javascrit

Question

I am trying to put together a registration form via javascript where it opens a form via dialog.

<div id="toolbar">
        <a href="javascript:void(0)" class="linkbutton" iconCls="icon-add" plain="true" onclick="newUser()">Novo Usu&aacute;rio</a>
        <a href="javascript:void(0)" class="linkbutton" iconCls="icon-edit" plain="true" onclick="editUser()">Editar Usu&aacute;rio</a>
        <a href="javascript:void(0)" class="linkbutton" iconCls="icon-remove" plain="true" onclick="destroyUser()">Excluir Usu&aacute;rio</a>
    </div>

    <div id="dlg" class="dialog" style="width:400px;height:280px;padding:10px 20px"
            closed="true" buttons="#dlg-buttons">
        <div class="ftitle">Usu&aacute;rio</div>
        <form id="fm" method="POST">
            <div class="fitem">
                <label>Nome:</label>
                <input name="Name" class="textbox" required="true">
            </div>
            <div class="fitem">
                <label>Usu&aacute;rio:</label>
                <input name="User" class="textbox" required="true">
            </div>
            <div class="fitem">
                <label>Email:</label>
                <input name="Email" class="textbox" validType="email">
            </div>
            <div class="fitem">
                <label>Telefone:</label>
                <input name="Phone" class="textbox">
            </div>
            <div class="fitem">
                <label>Depart:</label>
                <select name="Department">
                <?php
                    echo SelectDepartment ();
                ?>
                </select>                
            </div>            
            <div class="fitem">
                <label>Level:</label>
                <select name="Level">
                    <option value="Admin">Admin</option>
                    <option value="Usuario">Usuario</option>                                                        
                </select>           
            </div>
            <div class="fitem">
                <label>Senha:</label>
                <input name="Password" type="password" class="textbox">
            </div>
            <input type="checkbox" name="active" value="1" required /><label>Ativo</label><br>
        </form>
    </div>
    <div id="dlg-buttons">          
        <a href="javascript:void(0)" class="linkbutton c6" iconCls="icon-ok" onclick="saveUser()" style="width:90px">Salvar</a>
        <a href="javascript:void(0)" class="linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')" style="width:90px">Cancelar</a>
    </div>

Mount the form.

var url;        
        function newUser(){
            $('#dlg').dialog('open').dialog('center').dialog('setTitle','Novo');
            $('#fm').form('clear');
            url = 'connect/register.php';            
        }

Mount Action="connect/Register.php" by clicking save.

function saveUser(){
            $('#fm').form('submit',{
                url: url,
                onSubmit: function(){
                    return $(this).form('validate');
                },
                success: function(result){
                    var result = eval('('+result+')');
                    if (result.errorMsg){
                        $.messager.show({
                            title: 'Error',
                            msg: result.errorMsg
                        });
                    } else {
                        $('#dlg').dialog('close');        // fecha dialog
                        $('#dg').datagrid('reload');    // recarrega dados
                    }
                }
            });
        }

But I can’t even get him to send the information to my Register.php

It is showing another error now on the console

 var _528 = 10;
            function cb() {
                var f = $("#" + _521);
                if (!f.length) {
                    return;
                }
                f.unbind();
                var data = "";
                try {
                    var body = f.contents().find("body");
                    data = body.html();
                    if (data == "") {
                        if (--_528) {
                            setTimeout(cb, 100);
                            return;
                        }
                    }
                    var ta = body.find(">textarea");
                    if (ta.length) {
                        data = ta.val();
                    } else {
                        var pre = body.find(">pre");
                        if (pre.length) {
                            data = pre.html();
                        }
                    }
                } catch (e) {
                }
                opts.success(data);
                setTimeout(function() {
                    f.unbind();
                    f.remove();
                }, 100);
            }
            ;
        }
        ;

He’s stopping at: opts.success(data);

I’m still the code I put in.

Answer 1

There are some errors in your code. See on jsFiddler the example I made for you to see.

I modified the code a little, I added a Document.ready to set the dialog and bindar the click to which saves and sends the data to your php.

var url = 'connect/register.php';   

function newUser(){
 $('#dlg').dialog('open').dialog('center').dialog('setTitle','Novo');
  $('#fm').form('clear');         
}


$(document).ready(function(){
    $('#dlg').dialog();
    $('.c6').bind('click',function(){
    saveUser();
  });

});

function saveUser(){
  $.ajax({
    url: url,
    beforeSend: function( xhr ) {
      xhr.overrideMimeType( "text/plain; charset=x-user-defined" );
    }
  })
  .done(function( data ) {
      var result = eval('('+data+')');
      if (result.errorMsg){
        $.messager.show({
          title: 'Error',
          msg: result.errorMsg
        });
      } else {
        $('#dlg').dialog('close');        // fecha dialog
        $('#dg').datagrid('reload');    // recarrega dados
      }
  });

}

See if it helps.