Angular.js,在表单中重复并提交POST值

时间:2013-02-12 08:25:17

标签: php angularjs

我是Angular.js的新手,我正试图弄清楚如何从提交表单中获取数据。但这些字段是ng-repeat的一部分。在我使用ajaxSubmitButton提交到一个只显示post值的php服务器端脚本时,它只显示最后一个输入字段......如果这有意义的话。 这是表单代码:

<form class="form">
<div id="client-form" ng:controller="ClientForm">
  <div class="client" ng:repeat="client in form.clients">
    <div class="row">
      <input type="text" name="client.name" size="80" />
    </div>
  </div>

<div>
    <?php echo  CHtml::ajaxSubmitButton(
                    'Submit',
                    CHtml::normalizeUrl(array('client/create.php')),
                    array(
                        'success'=>'function(data){
                            alert("success:"+data);
                        }',
                    )
                ); ?>
</div>

JavaScript如下:

<script src="'/js/angular.min.js'; ?>" ng:autobind></script>
<script>
function ClientForm(){
  this.form = {
    clients : [
      { name: 'test1', },
      { name: 'test2', },
      { name: 'test3', },
    ]
  };

}
</script>

PHP脚本非常简单:

<?php
    print_r($_POST);
?>

ajaxSubmitButton调用中的警报返回以下内容:

success:Array
(
  [client]=>test3
)

如您所见,它只返回最后一个输入文本字段的值。

我确信这里肯定有一些我做错了,但似乎无法看到它。任何指导都会很棒。

感谢。

1 个答案:

答案 0 :(得分:0)

我设法找到了答案,这要归功于YC的一个人 - 不记得你的名字,但谢谢! 基本上我不得不将字段的name属性更改为数组。

<input name="client[name][]" value="{{client.name}}" />

这现在适用于文本字段。 但是对于选择下拉列表,它不再选择预定义值。

<form class="form">
<div id="client-form" ng:controller="ClientForm">
  <div class="client" ng:repeat="client in form.clients">
    <div class="row">
      <input name="client[name][]" value="{{client.name}}" /><input name="client[id][]" value="{{client.id}}" />
      <?php
        echo CHtml::dropDownList('client[select][]', '{{client.select}}', CHtml::listData(Region::model()->findAll(array('order' => 'name')), 'id', 'name'), array('empty' => 'Select a Region'));
      ?>{{client.id}}
    </div>
  </div>

<div>

使用Javascript:

<script src="<?php echo Yii::app()->baseUrl . '/js/angular.min.js'; ?>" ng:autobind></script>
<script>
function ClientForm(){
  this.form = {
    clients : [
      { name: 'test1', id:'1', select:'1'},
      { name: 'test2', id:'2', select:'2'},
      { name: 'test3', id:'3', select:'3'},
    ]
  };

}
</script>

任何想法如何确保我的选择列表现已预先填充?

感谢。