关于jQuery文件上传

<tr>
                        <th width="150" class="jcjh1" align="center">事故报告名称</th>
                        <td class="jcjh"><input type="text" name="accident.paperName"
                            id="paperName" value="${accident.paperName}"
                            class="easyui-validatebox" data-options="required:false" /></td>
                        <th width="150" class="jcjh1" align="center">报告文件</th>
                        <td class="jcjh">
                            <div style="width: 315px; height: 25px; position: relative;">
                                <input type="text" id="paperFile" name="accident.paperpath"
                                    class="crs-upload-name easyui-validatebox"
                                    data-options="required:false" value="${accident.paperpath }"
                                    readonly="readonly" style="width: 280px; padding-right: 26px;" />
                                <input type="hidden" id="audioFilePath" name="" value=""
                                    class="crs-upload-path" /> <span id="paperUploader"
                                    class="crs-ile-uploader" style="position: absolute;"
                                    title="上传文件"></span>
                            </div>
                        </td>
                    </tr>
var $planSelDlg;
    $(function() {
        if ('${accident}') {
            $("select[name='accident.acc_area']").val('${accident.acc_area}');
            $("select[name='accident.eco_type']").val('${accident.eco_type}');
            $("select[name='accident.col_company']").val('${accident.col_company}');
            $("select[name='accident.acc_type']").val('${accident.acc_type}');
            $("select[name='accident.acc_level']").val('${accident.acc_level}');
        }
        $planSelDlg = $("#planSelDialog");

        $planSelDlg.dialog({
            title : "选择监察方案",
            width : 900,
            height : 400,
            closed : true,
            modal : true,
            draggable : false,
            buttons : "#planSelDialogButtons"
        });
//加载文件预览效果 $(
"#paperUploader").kyuploadify({ width : 24, height : 23, formData : { "pair.fileType" : "paper", "pair.ajax" : true }, fileTypeDesc : "文书文件", fileTypeExts : "*.*", onUploadSuccess : function(file, data) { $.crs.result(data, function(ret) { $("#paperFile").val(ret.attributes["path"]).focus(); }); }, onUploadError : function(file) { } }); if ("${accident}") { } });

引入的js文件

<link href="pages/doc/as/styles/css/blue.css" type="text/css" rel="stylesheet" />
<link rel="stylesheet" href="styles/common/css/bootstrap.min.css" type="text/css" />
<link href="styles/common/css/blue.css" type="text/css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="resources/scripts/frameworks/jquery.easyui.1.3.2/themes/icon.css" />
<link rel="stylesheet" type="text/css" href="scripts/frameworks/jquery.ui.autocomplete.1.11.4/jquery-ui.min.css" />
<link href="resources/scripts/jquery.crs/uploadify.css" type="text/css" rel="stylesheet"></link>
<script type="text/javascript"src="scripts/frameworks/jquery.ui.autocomplete.1.11.4/jquery-ui.min.js"></script>
<script type="text/javascript"src="resources/scripts/frameworks/jquery.uploadify.3.2.1/jquery.uploadify.min.js"></script>
<script type="text/javascript"src="resources/scripts/jquery.crs/jquery.crs.kyuploadify.js"></script>
//文件加载器见上标红处处理
<script type="text/javascript" src="pages/doc/as/scripts/jquery.crs/jquery.crs.kyform.js"></script>

style

<style>
* {
    margin: 0;
    padding: 0;
}

li {
    list-style: none;
}

.nav_new {
    float: left;
    position: relative;
    left: -20px;
    top: 10px;
}

#name {
    float: left;
}

#dic_data {
    position: absolute;
    left: 0;
    top: 30px;
    float: left;
    display: block;
    width: 210px;
}

#dic_data li {
    display: block;
    background: #ccc;
    height: 27px;
    line-height: 27px;
    cursor: pointer;
    text-align: center;
}

#dic_data li:hover {
    background: gray;
}

html {
    padding: 0px;
    margin: 0;
}

.uploadify {
    top: 3px;
    right: 0px;
    position: absolute;
}

.uploadify-button {
    border: 0px;
    border-radius: 0px;
    background: url(resources/styles/images/folder.png) no-repeat;
}

.uploadify:hover .uploadify-button {
    background: url(resources/styles/images/folder.png) no-repeat;
}

.validatebox-invalid {
    background-position: left center;
}
</style>

 

地区与监管机构的联动设置

function onAreaChange() {
        var area = $('#acc_area').val();
        if (area == '长春' || area == '四平' || area == '辽源' || area == '白城') {
            $("select[name='accident.col_company']").val('辽源分局')
        } else if (area == '通化' || area == '白山') {
            $("select[name='accident.col_company']").val('白山分局')
        } else if (area == '延边') {
            $("select[name='accident.col_company']").val('延边分局')
        } else if (area == '吉林') {
            $("select[name='accident.col_company']").val('吉林站')
        }
    }

html

 <th>所属地市</th>
 <td>
   <select id="acc_area" class="crs_ep_addipt" onchange="onAreaChange()" name="accident.acc_area" style="width: 216px; height: 33px">
      <s:iterator value="datas['地市']" var="area">
         <option value="${dicName }">${dicName }</option>
      </s:iterator>
    </select>
 </td>
 <th>所属单位</th>
 <td>
       <select class="crs_ep_addipt" name="accident.col_company" style="width: 216px; height: 33px">
            <s:iterator value="datas['局']" var="area">
                <option value="${dicName }">${dicName }</option>
            </s:iterator>
      </select>
 </td>

 

posted @ 2017-09-26 09:40  夜西门吹雪孤城花满楼  阅读(137)  评论(0编辑  收藏  举报