1. 程式人生 > >beego購物車ajax非同步重新整理

beego購物車ajax非同步重新整理

資料庫中新增購物車資料的時候,頁面只是進行區域性重新整理。區域性重新整理我們一般用ajax來實現這個功能,那這裡我們就用ajax傳送請求。

請求

新增購物車,需要傳遞資料,我們一般是用post請求,函式名是$.post(),有三個引數,第一個引數是請求路徑,第二個引數是傳遞的資料(json格式的資料),第三個引數是成功後所執行的函式

所以在傳送請求之前,我們需要先確定請求路徑,新增購物車資料需要登陸的狀態下才能進行,所以我們設定請求路徑為/user/addCart。

接著我們要去構造傳遞的資料,新增購物車,需要把商品id和對應的數量傳遞給後臺,這裡我們設計資料格式為{“skuid”:id,“count”:count}。

最後是我們的函式。程式碼如下:

  • 封裝要傳遞的資料 我們要傳遞的資料為商品的id,所以我們需要獲取這個id,但是這時候你發現,我們頁面裡面沒有顯示商品id的地方。那這裡需要我們手動在頁面裡面新增這個內容,有兩種解決方法: 第一種:隱藏域傳值,這個方法我們前面用過,不做詳細介紹。 第二種:給某一個標籤新增一個自定義屬性,獲取這個屬性的值,這裡我們給加入購物車按鈕新增一個商品ID屬性,程式碼如下:
    • 獲取自定義屬性的值,使用attr()方法。具體程式碼如下: skuid = $(’#add_cart’).attr(“skuid”) 獲取商品數量,直接獲取相應標籤值即可,程式碼如下: count = $(’.num_show’).val() 封裝成一個json格式的資料包,程式碼如下: params = {‘skuid’:skuid,‘goodsCount’:count}
  • 傳送請求 $.post(’/user/addCart’,params,function (data) {})

路由

ajax傳送了請求之後,我們要在router.go中新增相對應的控制器和方法。

 beego.Router("/user/addCart",&controllers.CartController{},"post:HandleAddCart")

控制器

在路由指定了控制器和方法之後,我們就建立控制器並且實現HandleAddCart方法。

  • 獲取資料 skuid,err1 := this.GetInt(“skuid”) count,err2 := this.GetInt(“goodsCount”)

  • 校驗資料 校驗資料傳輸是否正確 //返回資料 resp := make(map[string]interface{}) defer this.ServeJSON()

    //資料校驗
    if err1 != nil || err2 != nil{
    	resp["res"]=1
    	resp["errmsg"] = "獲取資料資訊錯誤"
    	this.Data["json"] = resp
    	return
    }
    

    注意,ajax傳遞過來的資料,我們回覆的時候不再指定檢視,而是回覆給檢視json格式的資料。那這裡我們怎麼給檢視中傳遞json資料呢? 首先定義一個map[string]interface型別,用來儲存返回的資料,然後指定傳遞的資料程式碼為: this.Data[“json”] = resp 接著呼叫傳遞資料函式: this.ServeJSON() 不管能不能執行成功我們都要給ajax請求返回資料,所以這裡我們可以直接defer呼叫函式的程式碼。