<style>
#add{
padding: 8px;
}
#add table{
width:100%;
border-collapse: collapse;
border-color: #D4D4D4;
border:0px;
}
#add table tr{
height: 30px;
line-height: 30px;
}
#add table th{
text-align: center;
color: #777;
width:100px;
}
#add table td{
padding: 4px 10px;
}
.isshow{
position: relative;
top:-6px;
outline: none;
}
.show{
position: relative;
top:1px;
}
.textbox{
height: 20px;
line-height: 20px;
padding: 2px;
outline: none;
}
.textbox-addon {
position: absolute;
top: 2px;
}
#submit{
margin-left: 30px;
}
input[name=display]{
position: relative;
top: 4px;
}
/* 图片上传样式 */
#file{
margin: 0;
position: absolute;
top:7px;
left: 10px;
}
/* 图片上传样式结束 */
</style>
<script>
$(function(){
/* 图片上传 */ $("#file").uploadify({
swf:ThinkPHP['UPLOADIFY']+'/uploadify.swf',
uploader:ThinkPHP['MODULE']+'/Uploads/upload',
width:100,
height:25,
buttonCursor:'pointer',
buttonText:'上传图片',
fileTypeDesc:'图片类型',
fileTypeExts:'*.jpeg; *.jpg; *.png; *.gif;',
fileSizeLimit:'1MB',
overrideEvents:['onSelectError','onDialogClose','onSelect'], //覆盖错误提示和上传列表 onSelectError:function (file,errorCode,errorMsg) { //上传超出限制 switch (errorCode){
case -110:
$.messager.alert('警告','超出图片限制!','warning');
break;
}
},
onUploadStart:function () { //再上传之前的动作 $.messager.progress();
},
onUploadSuccess:function (file,data,response) { //图片上传成功后的方法 $.messager.progress('close');
$(".brandImg").attr('src',ThinkPHP['ROOT']+'/'+data);
$('.imageUrl').append('<input type="hidden" name="image" value='+data+' />');
}
});
/* 图片上传结束 */ /* 验证表单信息 */ checkData();
function checkData() {
$('#bname').validatebox({
required: true,
missingMessage:'请输入商标名称'
});
$('#url').validatebox({
required: true,
missingMessage:'请输入商标链接'
});
$('#sort').validatebox({
required: true,
missingMessage:'请输入排序'
});
$('#info').validatebox({
required: true,
missingMessage:'请输入描述'
});
}
/* 验证表单信息结束 */ /* 提交数据 */ $("#submit").click(function(){
if( !$('#bname').validatebox('isValid') ){
$('#bname').focus();
return;
}
if( !$('#url').validatebox('isValid') ){
$('#url').focus();
return;
}
if( !$('#sort').validatebox('isValid') ){
$('#sort').focus();
return;
}
if( !$('#info').validatebox('isValid') ){
$('#info').focus();
return;
}
//保存图片路径 $.ajax({
url:ThinkPHP['MODULE']+'/Brand/add',
type:'post',
data:{
bname:$('#bname').val(),
image:$('input[name=image]').val(),
url:$("#url").val(),
info:$("#info").val(),
display:$("input[name=display]:checked").val(),
sort:$("#sort").val()
},
success:function(data){
if(data>0) {
$('#tabs').tabs('close', '添加商标');//关闭当前tabs $('#brand').datagrid('reload');//刷新分类数据表格 $.messager.show({
title: '我的消息',
msg: '添加成功',
timeout: 1000,
showType: 'slide'
});
}
}
});
});
/* 提交数据结束 */ });
</script>
<form id="add" data-options="iconCls:'icon-building_add'">
<table border="1">
<tr>
<th>商标名称</th>
<td>
<input type="text" name="bname" id="bname" class="textbox reset">
</td>
</tr>
<tr>
<th>上传图片</th>
<td style="position: relative; height: 30px;">
<input type="file" id="file" />
</td>
</tr>
<tr>
<th>商标图片</th>
<td class="imageUrl">
<img class="brandImg" src="" style="vertical-align: top;"/>
</td>
</tr>
<tr>
<th>商标链接</th>
<td>
<input type="text" id="url" class="textbox" name="url">
</td>
</tr>
<tr>
<th>是否显示</th>
<td>
<label for="xs" >显示</label><input id="xs" type="radio" checked name="display" value="1" >
<label for="yc" >隐藏</label><input id="yc" type="radio" name="display" value="0">
</td>
</tr>
<tr>
<th>排序</th>
<td>
<input type="text" name="sort" id="sort" class="textbox" />
</td>
</tr>
<tr>
<th>商标描述</th>
<td>
<textarea class="textbox" id="info" style="width:385px;height: 140px;"></textarea>
</td>
</tr>
<tr>
<td colspan="2">
<a id="submit" data-options="iconCls:'icon-accept'" href="javascript:void(0);" class="easyui-linkbutton">添加商标</a>
</td>
</tr>
</table>
</form>
