angularJs提交文本框数据到后台的方法

如下所示：

ng-model="name" //填写的数据提交到index.php

index.html

<!doctype html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <script src="angular.min.js"></script>
</head>
<body>
<div ng-app="module" ng-controller="ctrl">
//form表单提交
 <form action="index.php" method="post">
  <input type="text" name="title" ng-model="name">
  {{name}}
  <input type="submit">
 </form>
</div>
<script>
 var m = angular.module('module', []);
 m.controller('ctrl', ['$scope', function ($scope) {
  $scope.name = '泠泠在路上';
 }]);
</script>
</body>
</html>

index.php

<?php
print_r($_POST);

以上这篇angularJs提交文本框数据到后台的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 浅谈angularjs $http提交数据探索

    浅谈angularjs $http提交数据探索

    前两天在搞自己的项目,前端js框架用的是angularjs框架:网站整的差不多的时候出事了:那就是当我用$http.post()方法向服务器提交一些数据的时候:后台总是接收不到数据: 于是采用了其他方法暂时性替代一下: 今天正好有时间研究这个事情:网上查了很多资料:都试了试:都是不太好:但是还是给我提供了一些解决问题的思路: 正文开始:首先做了个demo如下:主要是为了比较他们的不同之处: html如下: <div class="container-fluid" data-ng-

  • angular使用post、get向后台传参的问题实例

    一.问题的来源 我们都知道向后台传参可以使用get.put,其形式就类似于name=jyy&id=001.但是在ng中我却发现使用$http post进行异步传输的过程中后台是接收不到数据的.其实这个问题是因为请求头的缘故.在ng中默认的请求头是:"Content-Type":"application/json",也就是说传递参数是使用的就是json格式.但是后台默认的却是Content-Type': 'application/x-www-form-urle

  • 快速解决angularJS中用post方法时后台拿不到值的问题

    用angularJS中的$http服务碰到了一个问题:运用$http.post方法向后台传递数据时,后台的php页面获取不到data参数传过来的值. 不论是这种姿势: $http.post( "1.php", { id: 1 }).success(function (data) { console.log(data); }); 还是这种姿势: $http({ method: 'POST', url: '1.php', data: { id: 1 } }).success(functio

  • AngularJS表单提交实例详解

    本文实例讲述了AngularJS表单提交.分享给大家供大家参考,具体如下: AngularJS中的数据绑定 AngularJS创建实时模板来代替视图,而不是将数据合并进模板之后更新DOM.任何一个独立视图组件中的值都是动态替换的. ng-app属性声明所有被其包含的内容都属于这个AngularJS应用,这也是我们可以在Web应用中嵌套AngularJS应用的原因.只有被具有ng-app属性的DOM元素包含的元素才会受AngularJS影响. 当AngularJS认为某个值可能发生变化时,它会运行

  • angularJs提交文本框数据到后台的方法

    如下所示: ng-model="name" //填写的数据提交到index.php index.html <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <script src="angular.min.js"></script> </head> <body&g

  • C#与js实现去除textbox文本框里面重复记录的方法

    本文以实例形式展示了C#与js实现去除textbox文本框里面重复记录的方法!具体方法如下: 现有如下问题:页面有一个textbox文本框(是多行的),比如我在文本框里面输入:111,222,333,555当再输入111的时候会自动清除掉这个111,或者是在提交一个按钮前清除掉这个相同记录! 解决方案如下: 以逗号分割成一个数组 有一个Split()方法 然后比较 里面相等的就删除掉后面的那个 形成新的实例 再把新实例按格式输进来~ C#代码如下: string temp_str = "111,

  • 解决bootstrap模态框数据缓存的问题方法

    问题背景 第一步进行新增验证 第二步进行修改模态框 验证信息没有消除 且表单数据被缓存 模态框代码:新增修改共用一个模态框 <!-- 模态框(Modal) --> <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="

  • JS清除文本框内容离开在恢复及鼠标离开文本框时触发js的方法

    多网站的需要填写的文本框在默认状态下都会给出一个默认的提示语言,当鼠标点击此文本框的时候能够将里面的默认文本清除,当删除输入的文本且焦点离开文本框的时候再将默认的文本写入文本框. 代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.jb51.net/&quo

  • js限制文本框只能输入中文的方法

    js限制文本框只能输入中文的方法

    本文实例讲述了js限制文本框只能输入中文的方法.分享给大家供大家参考.具体如下: 让文本框只能输入中文的方法及代码,如果你不小心输入了英文,它会自动倒回去,清空你的输入,直至你输入了中文它可会继续,很有意思,也很实用,当注册一些资料的时候可以来提升输入的准确度. 运行效果如下图所示: 具体代码如下: <html> <head> <title>让一个文本框只能输入汉字的方法</title> <meta http-equiv="Content-T

  • C#判断多个文本框是否为空的方法

    本文实例讲述了C#判断多个文本框是否为空的方法.分享给大家供大家参考.具体实现方法如下: /// <summary> /// 自定义方法,判断项目中txt标签是否为空 /// </summary> /// <param name="txt">要进行判断为空的标签</param> /// <returns>是否全部都不为空,如果全部都不为空返回 true </returns> bool CheckEmpty(para

  • js实现鼠标点击文本框自动选中内容的方法

    js实现鼠标点击文本框自动选中内容的方法

    本文实例讲述了js实现鼠标点击文本框自动选中内容的方法.分享给大家供大家参考.具体如下: 这里使用JS实现鼠标点击时自动选中文本框文本的效果,相信许多朋友都遇到这种功能的,就是当我们点击文本框的时候,文本框中默认的文字会被全部选中,这样当你输入的时候不用再去选择,省去了一些麻烦,提高了输入效率,用户肯定会喜欢这功能,那么实现的方法是怎么样呢?通过本代码你就搞明白了. 先来看看运行效果截图: 在线演示地址如下: http://demo.jb51.net/js/2015/js-mouse-click

  • jquery实现点击label的同时触发文本框点击事件的方法

    本文实例讲述了jquery实现点击label的同时触发文本框点击事件的方法.分享给大家供大家参考.具体实现方法如下: var labelID; $('label').click(function() { labelID = $(this).attr('for'); $('#'+labelID).trigger('click'); }); 希望本文所述对大家的jQuery程序设计有所帮助.

  • jQuery实现限制textarea文本框输入字符数量的方法

    本文实例讲述了jQuery实现限制textarea文本框输入字符数量的方法.分享给大家供大家参考.具体实现方法如下: (function($) { $.fn.extend( { limiter: function(limit, elem) { $(this).on("keyup focus", function() { setCount(this, elem); }); function setCount(src, elem) { var chars = src.value.lengt

  • vue select选择框数据变化监听方法

    1.使用v-model在select标签上进行数据双向绑定, 2.在data里边添加val:' ', 3.最后就是监听事件的写法,写在methods之外. 附加:(以下图片借鉴他人,非原创) 以上这篇vue select选择框数据变化监听方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.

随机推荐