在 Sencha Touch 2 中提交表单

Posted

技术标签:

【中文标题】在 Sencha Touch 2 中提交表单【英文标题】:Submitting a form in Sencha Touch 2 【发布时间】:2012-03-23 16:38:39 【问题描述】:

我正在尝试使用我下载的 SDK 中提供的标准表单提交表单。

有人知道它是如何通过的吗?关于如何通过它的任何提示?

我正在尝试制作一个非常简单的提交表单来收集一些信息。

                    title: 'Register',
                    iconCls: 'add',
                    xtype: 'formpanel',
                    url: 'contact.php',
                    layout: 'vbox',
                    scrollable: true,



                    items: [
                        
                            xtype: 'fieldset',
                            title: 'Opt In',
                            instructions: 'Want more info on Monster Energy? Opt-in to receive updates. ',

                            items: [
                                
                                    xtype: 'textfield',
                                    label: 'First Name',
                                    name: 'fname',
                                ,
                                
                                    xtype: 'textfield',
                                    label: 'Last Name',
                                    name: 'lname',
                                ,
                                
                                    xtype: 'emailfield',
                                    label: 'Email',
                                    name: 'email',
                                ,
                                
                                    xtype: 'numberfield',
                                    label: 'Phone',
                                    name: 'phone',
                                
                            ]
                        ,
                        
                            xtype: 'button',
                            text: 'Send',
                            ui: 'confirm',
                            handler: function() 
                                this.up('formpanel').submit();
                            
                        
                    ]
                

联系人.php

<?phpinclude_once "config.php";
mysql_connect($dbhost, $dbuser, $dbpasswd);
mysql_select_db($dbname) or die ("Cannot select db" . mysql_error());
session_start();


//***** Get today's date
$today = date("Y-m-d H:i:s");
$date = date("Y-m-d");


$firstName = addslashes($_POST['fname']);
$lastName = addslashes($_POST['lname']);
$email = $_POST['email'];
$phone = $_POST['phone'];


$sql = "INSERT INTO customer_31
            (mb_firstName, 
            mb_lastName,
            mb_phone,
            mb_email,
            mb_date_entered) 
            VALUES 
            ('$firstName', 
            '$lastName', 
            '$phone',
            '$email')";




header("location:index.php");
exit();

?>

【问题讨论】:

不确定是否是这个原因...但是contact.php缺少一些代码mysql_query($sql); 【参考方案1】:

您需要从 php 中的 INSERT 语句中删除 mb_date_entered

【讨论】:

试过了,没区别。 (还添加了 $today 变量,因此无论如何它都应该工作)【参考方案2】:

好吧,虽然我还没有将 .up 用于表单提交,但我之前做了类似的事情,首先在父项上使用 getValues(),进行一些验证,然后将其触发到 PHP 中。以下是一些代码,希望对您有所帮助:

handler: function(btn)
            var vals = btn.parent.parent.getValues();
            vals.time = new Date();

           //basic email validation
            var re = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]2,4$/;
            var result=re.test(vals.email);
            if (result === true)
                Ext.Ajax.request(
                url: btn.parent.parent.getUrl(),
                params:    
                        data:Ext.JSON.encode(vals),
                        encoded: vals.toString(),
                        vals: 'other='+JSON.stringify(vals)
                        ,
                success: function(res, vals)
                        console.log(res);
                        console.log(JSON.stringify(vals));
                        Ext.Viewport.getMasked().hide();
                        Ext.Msg.alert('Thank you', 'Message received successfully.', Ext.emptyFn);
                        Ext.getCmp('contactForm').reset();
                        ,

                failure: function(res)
                        console.log('form not submitted', res);
                        Ext.Viewport.getMasked().hide();
                        Ext.getCmp('contactForm').reset();
                        Ext.Msg.alert('Sorry something went wrong', 'Please try that again', Ext.emptyFn);
                        
                );
            

            if (result === false)
                Ext.Viewport.getMasked().hide();
                Ext.Msg.alert('Invalid Email', 'Please try again', Ext.emptyFn);
                Ext.getCmp('contactForm').reset();

            
        

PHP

<?php
        $errorMessage = "";

            $db = mysql_connect("YOURDB","USER","PASS");
            if(!$db) die("Error connecting to MySQL database.");
            mysql_select_db('formtest' ,$db);

            $json = $_POST['data'];
            $json = utf8_encode($json);

            $insert = "INSERT INTO formdata VALUES ('".$json."')";

            var_dump($_GET);

            if(mysql_query($insert))
            
                echo('values inserted successfully');
                header("Location: thankyou.html");

            
            else
            
                echo('failure' . mysql_error());
            

            exit();
?>

【讨论】:

以上是关于在 Sencha Touch 2 中提交表单的主要内容,如果未能解决你的问题,请参考以下文章

禁用 Go 按钮提交表单(Sencha Touch 2、Cordova、Android)

Sencha Touch:输入键提交表单

使用 sencha touch 2 表单在 textfiend 中启用掩码?

Sencha Touch 2:在表单字段下方显示错误消息

Sencha Touch 2.1 自动进入下一个字段

如何使用 Sencha Touch 2 获取表单面板和禁用选择字段