weiphp添加新字段类型方案

环境:sae版本的weiphp

一、添加字段类型选择。

文件目录：Application->Admin->Common->function.php

修改函数名：get_attribute_type

添加： 'map'     =>  array('地图','varchar(255) NOT NULL'),

二、修改HTML中的对应模板内容

字段内容添加修改：

 文件目录：Application->Home->View->default->Addons->add.html

添加内容：

 <case value="map">
                             <input type="text" class="text input-large" readonly="readonly"  id="lng_lat_{$field.name}" name="{$field.name}" value="{$data[$field['name']]}"/>
                              <script charset="utf-8" src="http://map.qq.com/api/js?v=2.exp"></script>
                          <script type="text/javascript">
                             function init(){
                                    var center=new qq.maps.LatLng(24.313389,109.411211);
                                    var map=new qq.maps.Map(document.getElementById("container"),{
                                        center:center,
                                        zoom:14
                                    });
                                    var marker=new qq.maps.Marker();
                                    //给map绑定mousemove事件
                                    var label = new qq.maps.Label({
                                        offset:new qq.maps.Size(15,0)
                                    });
                                    //添加监听事件    监听鼠标移动 添加 当前鼠标的经纬度信息
                                    qq.maps.event.addListener(map,"mousemove",function(e){
                                        label.setContent(e.latLng.toString());
                                        label.setPosition(e.latLng);
                                    });
                                    //添加监听事件  当鼠标移到图层上面显示图层
                                    qq.maps.event.addListener(map,"mouseover",function(e){
                                        label.setMap(map);
                                    });
                                    //添加监听事件  当鼠标离开的时候 设置图层为空
                                    qq.maps.event.addListener(map,"mouseout",function(e){
                                        label.setMap(null);
                                    });
                                    qq.maps.event.addListener(map,"click",function(e){
                                        $("#lng_lat_{$field.name}").val(e.latLng.getLat()+","+e.latLng.getLng()) ;
                                        //     $("#latitude").val(e.latLng.getLat());
                                        marker.setMap(null);
                                        var a_center=new qq.maps.LatLng(e.latLng.getLat(),e.latLng.getLng());
                                        marker=new qq.maps.Marker({
                                            position:a_center,
                                            animation:qq.maps.MarkerAnimation.DROP,
                                            map:map
                                        });
                                    });
                                }
                              window.onload=init;
                                </script> 
                          <div onload="init();" class="controls">
                               <div id="container" style="height: 500px; width: 100%;"></div>
                          </div>
                          
                        </case>

 

添加的时候就可以在新建字段里面添加新的内容了，但是还不行哦。

三、字段内容修改html模板修改

 文件目录：Application->Home->View->default->Addons->edit.html

添加代码：

 <case value="map">

                            <input type="text" class="text input-large" readonly="readonly"  id="lng_lat_{$field.name}" name="{$field.name}" value="{$data[$field['name']]}"/>
                            <script charset="utf-8" src="http://map.qq.com/api/js?v=2.exp"></script>
                            <script type="text/javascript">
                                function init(){
                                    var center=new qq.maps.LatLng({$data[$field['name']]});
                                    
                                    var map=new qq.maps.Map(document.getElementById("container"),{
                                        center:center,
                                        zoom:14
                                    });
                                    
                                    var marker=new qq.maps.Marker();
                                    var a_center=new qq.maps.LatLng({$data[$field['name']]});
                                    marker=new qq.maps.Marker({
                                        position:a_center,
                                        animation:qq.maps.MarkerAnimation.DROP,
                                        map:map
                                    });
                                    //给map绑定mousemove事件
                                    var label = new qq.maps.Label({
                                        offset:new qq.maps.Size(15,0)
                                    });
                                    //添加监听事件    监听鼠标移动 添加 当前鼠标的经纬度信息
                                    qq.maps.event.addListener(map,"mousemove",function(e){
                                        label.setContent(e.latLng.toString());
                                        label.setPosition(e.latLng);
                                    });
                                    //添加监听事件  当鼠标移到图层上面显示图层
                                    qq.maps.event.addListener(map,"mouseover",function(e){
                                        label.setMap(map);
                                    });
                                    //添加监听事件  当鼠标离开的时候 设置图层为空
                                    qq.maps.event.addListener(map,"mouseout",function(e){
                                        label.setMap(null);
                                    });
                                    qq.maps.event.addListener(map,"click",function(e){
                                        $("#lng_lat_{$field.name}").val(e.latLng.getLat()+","+e.latLng.getLng()) ;
                                        //     $("#latitude").val(e.latLng.getLat());
                                        marker.setMap(null);
                                        var a_center=new qq.maps.LatLng(e.latLng.getLat(),e.latLng.getLng());
                                        marker=new qq.maps.Marker({
                                            position:a_center,
                                            animation:qq.maps.MarkerAnimation.DROP,
                                            map:map
                                        });
                                    });
                                }
                                window.onload=init;
                            </script> 
                            <div onload="init();" class="controls">
                                <div id="container" style="height: 500px; width: 100%;"></div>
                            </div>
  
                            
                        </case>