为动态HTML元素添加值

时间:2015-09-11 16:44:34

标签: javascript jquery html laravel-5.1

我使用Laravel 5构建简单的CMS。 我根据attributes表中的值创建HTML元素。 所以,如果我有3 attributes喜欢:heightweightdimesion,那么我循环该值来创建HTML元素:

<input type='text' name='height' />
<input type='text' name='weight' />
<input type='text' name='dimension' />

当我从Controller获得数据时,如下所示:

{"id":1,"attribute_name":"Weight","type":"text","description":"Weight Product in (gram)","created_at":"2015-09-07 04:16:52","updated_at":"2015-09-07 04:16:52"}

我希望将该数据传递给指定的HTML元素,在上面的示例中,我想传递该数据:<input type='text' name='weight' />

所以在我的逻辑中我必须这样做:

  1. 根据attributes表值创建循环HTML。
  2. 从控制器循环数据
  3. 比较attribute_id == product->attribute_id,然后创建HTML元素并设置它。
  4. 这是我的实施:

    <div class="box-body">
          @if ($attributes != null)
            @foreach ($attributes as $attr)
              <div class="form-group">
                {!! Form::label('', $attr->attribute_name) !!}
    
                @foreach ($product->attributes as $pAttr)
                      @if ($attr->id == $pAttr->id)
                        @if ($attr->type == "text")
                          <input type="text" name="attributes[{{ $attr->id }}][value]" value="{{ $pAttr->pivot->value }}" class="form-control" />
                        @else
                          <textarea id="content2" name="attributes[{{ $attr->id }}][value]">{{ $pAttr->pivot->value }}</textarea>
                        @endif
                      @else 
                        @if ($attr->type == "text")
                          <input type="text" name="attributes[{{ $attr->id }}][value]" value="" class="form-control" />
                        @else
                          <textarea id="content2" name="attributes[{{ $attr->id }}][value]"></textarea>
                        @endif
                      @endif
                @endforeach
    
              </div>
            @endforeach
          @endif
        </div>
    

    但是,我得到以下结果: enter image description here 如何解决? 谢谢

2 个答案:

答案 0 :(得分:0)

试试这个:

<div class="box-body">
    @if ($attributes != null)
        {{-- START: loop attributes --}}
        @foreach ($attributes as $attr)
            <div class="form-group">
                {{-- START: loop product's attributes --}}
                @foreach ($product->attributes as $pAttr)
                    @if ($attr->type == "text")
                    <input type="text" name="attributes[{{ $attr->id }}][value]" value="{{ ($attr->id == $pAttr->id)? $pAttr->pivot->value : '' }}" class="form-control" />
                    @else
                      <textarea id="content2" name="attributes[{{ $attr->id }}][value]">{{ ($attr->id == $pAttr->id)? $pAttr->pivot->value : '' }}</textarea>
                    @endif
                @endforeach
                {{-- END: loop product's attributes --}}
            </div>
        @endforeach
        {{-- END: loop attributes --}}
    @endif
</div>

我删除了标签,因为它们里面没有文字。

答案 1 :(得分:0)

  

回答✔

我已经解决了我的问题。我构建动态HTML 我的控制器中的元素。所以控制器将传递HTML元素 具体价值。

这是我的代码:

$attrElements = array();
        foreach ($attributes as $attr) {
            $element = array();
            if ($attr->type == 'text') {
                $element = array(
                    'id' => $attr->id,
                    'name' => $attr->attribute_name,
                    'type' => 'text',
                    'element' => "<input type='text' name='attributes[". $attr->id ."][value]' value='' class='form-control' />"
                );
            } else {
                $element = array(
                    'id' => $attr->id,
                    'name' => $attr->attribute_name,
                    'type' => 'editor',
                    'element' => "<textarea name='attributes[". $attr->id ."][value]' class='form-control'></textarea>"
                );
            }

            array_push($attrElements, $element);
        }

        foreach ($attrElements as &$attrEl) {
            foreach ($product->attributes as $pAttr) {
                if ($pAttr->id == $attrEl['id']) {
                    // echo $pAttr->id  . " == " . $attrEl['id'] . " ? " . ($pAttr->id == $attrEl['id']);
                    // echo "<br/>";
                    if ($attrEl['type'] == 'text') {
                        $attrEl['element'] = "<input type='text' class='form-control' name='attributes[". $attrEl['id'] ."][value]' value='" . $pAttr->pivot->value . "' />";
                    } else {
                        $attrEl['element'] = "<textarea name='attributes[". $attrEl['id'] ."][value]' class='form-control'>" . $pAttr->pivot->value . "</textarea>";
                    }
                }
            }
        }

它有效! :d 谢谢..