打造顛覆你想象中的高性能,輕量級的webform框架---無刷新提交後臺(第四天)

来源:http://www.cnblogs.com/liujing379069296/archive/2017/07/30/7258088.html
-Advertisement-
Play Games

問題3:使用webform,每次提交後臺界面都要刷新,能不能讓我們與後臺 交互的時候像ajax一樣,界面不用刷新,同時還能返回參數並且繼續在前臺執行?? 相信很多人和我一樣,這也是很多人開發放棄webform最重要的原因吧!!這也是很多人覺得webform不好的原因吧!!!其實mvc提交form表單 ...


 

問題3:使用webform,每次提交後臺界面都要刷新,能不能讓我們與後臺 交互的時候像ajax一樣,界面不用刷新,同時還能返回參數並且繼續在前臺執行??

    相信很多人和我一樣,這也是很多人開發放棄webform最重要的原因吧!!這也是很多人覺得webform不好的原因吧!!!其實mvc提交form表單  也會刷新,但是 視圖中沒有像webfrom一樣的後臺,所以必須使用 ajax 的方法提交後臺,所以沒有刷新!

     其實這個問題的解決方案早在很多年前就已經解決了,只是知道的人不多,所以大家的印象中一直認為webform 提交後臺總是要界面刷新。這裡呢,我提供的2個種解決方案,也是我們工作和學習中常見的2個解決方案。

     第一種方法是使用 jquery.form.js   的插件,我們只需要將$("#form1").sumit() 改為 $("#form1").ajaxSubmit();

     例如: 

function ajaxGohoutai(fangfa,canshu,aftergo) {   .//前臺傳入參數和方法名字,後臺自動綁定執行方法
$("#hid_fangfa").val(fangfa);
$("#hid_canshu").val(canshu);

$("#form1").ajaxSubmit(function (result) {

aftergo(result);

});

}

實例:

  <input  type="button"  onclick="ajaxgo()"  value="ajax提交1個參數" />
function ajaxgo(){

ajaxGohoutai("ajax", "我不是人", function (result) {
alert(result);

});
}

  使用插件不是我們的初衷,我們希望能夠用我們的代碼去控制我們想要得到的數據以及能夠控制form表單輸出的數據,因為我們還是不知道 form表單能夠無刷新提交?

     想要弄懂這些個為什麼,我們必須要懂得form表單的屬性,為了讓大家更好的瞭解form 表單 屬性,我們來拿生活中常見 買菜的例子為例子。

    表單提交其實就是一個買菜的過程,買菜錢你要準備錢等一些東西,這個東西就是我們  表單控制項中的 用 name 屬性標記的,  它告訴們這些是我們需要提交的東西。

   買菜我們需要知道是什麼方式去買菜,坐車還是走路,還是其他方法,這個就是form表單的method 屬性 包括post,get,delete,put 屬性。

   買菜我們要知道去哪裡買菜?是去超市買菜,還是去菜市場買菜,還是去其他地方買菜,這屬性就是我們的  action的屬性,系統預設的為 該頁面本身地址的後臺,其實我們只需要改變form1表單的地址,同樣我們可以提交到其他頁面。

  買完菜之後我們需要將什麼地方重寫佈置一下?這裡的佈置就是刷新的意思,系統預設的 頁面本身的地址 ,系統預設屬性為target=“_self”, 下麵為其他屬性。

      

_blank 在新視窗中打開。
_self 預設。在相同的框架中打開。
_parent 在父框架集中打開。
_top 在整個視窗中打開。
framename 在指定的框架中打開。

 通過以上的屬性可以看出,導致form 表單提交後界面被刷新的罪魁禍首是  target=“_self”的屬性,它指向了自己,如果想界面不被刷新,我們看了一下,好像只能將target指向一個 iframe  的name的值,界面似乎就可以不被刷新了。下麵我們來試一下唄!!!!!在前面代碼的基礎上,我們只需要將提交的代碼修改成這樣。

  第一步 : 前臺加入 一個隱藏的iframe 。

       <iframe name="_NofreshIframe"  id="_NofreshIframe"  style="display:none;"></iframe>

第二步:修改我們以往的方法,在form表單提交將    target指向 為 iframe 的值,我們就可以不刷新提交了。

   例如:

$("#form1").attr("target", "_NofreshIframe");
$("#form1").submit();

然後我們測試 發現界面確實沒有刷新了,而且也能夠做到無刷新提交到後臺了。

但是我們發現,這還是不能達到我們想要的效果,什麼效果呢?我們需要在後臺執行完成後能馬上執行前臺,並且還能夠將參數傳遞給前臺,簡單點說就是要做到和ajax 的效果一樣!!!!!

    沒辦法,那執行放到下期去解決!!!!!!!

   

     

 

         

 

 

 

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • #!/bin/bash##for centos7 iptables table##yum install iptables-services -y###規則的排列是有順序的##清除預設規則 iptables -Fiptables -Xiptables -Z #設置策略 iptables -P INP ...
  • 1.1 刪除nginx,–purge包括配置文件 sudo apt-get --purge remove nginx 1.2 自動移除全部不使用的軟體包 sudo apt-get autoremove 1.3 羅列出與nginx相關的軟體 1.4 刪除1.3查詢出與nginx有關的軟體 這樣就可以完 ...
  • 一、系統環境 操作系統: centos 7 zabbix版本:3.2.5 二、安裝zabbix客戶端 # wget http://repo.zabbix.com/zabbix/3.2/rhel/7/x86_64/zabbix-release-3.2-1.el7.noarch .rpm # yum - ...
  • 新安裝了redhat6.5安裝後,登錄系統,使用yum update 更新系統。提示: This system is not registered to Red Hat Subscription Management. You can use subscription-manager to regi ...
  • 今天正在centos7.3裡面配置redis3.0, 結果make的時候拋出編譯中斷 CC adlist.oIn file included from adlist.c:34:0:zmalloc.h:50:31: 致命錯誤:jemalloc/jemalloc.h:沒有那個文件或目錄 #include... ...
  • sshd後門源碼: 這段代碼的意思: 第一行, 如果當前文件句柄STDIN是一個socket,且socket的遠程連接源埠是31334(Big 網路位元組序中的16進位字元串為\x00\x00zf, 正好匹配上perl正則 ..zf,上述代碼中的zf是Big 網路位元組序的Ascii表示形式),則執行 ...
  • Web伺服器接收到一個客戶端請求以後,會對請求予以相應,而這個響應是通過Response來控制的, 但是在asp.net mvc 里,這部分的工作是由ActionResult來完成的, ActionResult是一個抽象類,所以具體的工作還是由很多個子類來完成, 具體的子類有 EmptyResult ...
  • 做了好幾天,對象比較多,弄的都是亂的,最後還是一個個試出來的。 Bitmap Graphics FromImage Pen Rectangle DrawRectangle 真的混亂,看了好幾天,才明白參數之間的關係。 下載 pan.baidu.com/s/1c2CMRhY 思路:form1 就是界面 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...