Question

我使用bootstrap向用户返回有关上传结果的反馈。所以当上传顺利时，我使用绿色成功反馈，否则我会返回红色错误反馈。但如果他按下浏览按钮我想返回没有反馈输入标签，我该怎么办呢？这是我的代码的一部分：

<form class="input-group col-xs-12" method="post"
    enctype="multipart/form-data" th:action="@{/file/excelFileRead}">
    <div class="btn btn-primary btn-file col-xs-2">
        <!-- Using accept the browse window allows only excel files -->
        Browse&hellip; <input type="file" name="file"
            accept=".xls, .xlsx, .xlsm" />
    </div>

    <!-- Manage success message -->
    <div th:if="${opened == 'true'}">
        <div class="form-group has-success has-feedback col-xs-8">
            <input type="text" class="form-control" readonly="readonly"
                id="inputSuccess2" aria-describedby="inputSuccess2Status"
                th:value="${fileName}"> <span
                class="glyphicon glyphicon-ok form-control-feedback"
                aria-hidden="true"></span> <span id="inputSuccess2Status"
                class="sr-only">(success)</span>
                <label class="control-label"
                for="inputSuccess2" th:text="${successMessage}"></label> 
        </div>
    </div>

    <div th:if="${opened == 'false'}">
        <div class="form-group has-error has-feedback">
            <input type="text" class="form-control" readonly="readonly"
                id="inputError2" th:value="${fileName}"
                aria-describedby="inputError2Status"> <label
                class="control-label" for="inputError2"
                th:text="${errorMessage}"></label> <span
                class="glyphicon glyphicon-remove form-control-feedback"
                aria-hidden="true"></span> <span id="inputError2Status"
                class="sr-only">(error)</span>
        </div>
    </div>

<!--    <div th:if="${opened == null}">
        <div class="col-xs-8">
            <input type="text" class="form-control" readonly="readonly"
                th:value="${fileName}" />
        </div>
    </div>-->
    <div class="col-xs-2">
        <input type="submit" class="btn btn-info" value="Open" />
    </div> 
</form>

带文件上载的Bootstrap验证状态

0 个答案: