[Dự án] Shop Auto chọn nhiều pet

  Bài viết hay nhất1
First topic message reminder :

Shop auto chọn nhiều pet © FCAmusement - VnIcefox 2014
Thiết kế: Méo Hắc Hắc (NCat) - K.
Cùng với sự giúp đỡ đắc lực của Zzbaivong - Devs.cf
Hàng mẫu, có thể lỗi nhiều
Tuyệt đối không xóa phần copyright bên dưới shop

Thông tin cập nhật code:
Chuyển từ nhiều gian hàng sang gian hàng dạng tab
Khi chọn xong có thể click thêm một lần nữa để bỏ hàng đang chọn
Hiện số hàng đang chọn ở Giỏ Hàng
Khi chưa chọn hàng sẽ không thể click vào nút gửi hóa đơn
Khung thông tin vẫn bao gồm tên, tiền và bài gửi
Sau khi chọn xong thì click vào nút gửi hóa đơn màu tím
Nói chung là như thế :v
Demo: http://fcatest6.forumvi.com/h2-page


Code:
Tạo HTML : Do you wish to use your forum header and footer ? >> Có
Code:
<br/><div class="caigiday"><center><span style="font-size: 25px;font-weight: bold;color: #fff;">SHOP NÈ HÁ HÁ HÁ</span></center></div><br/>
<table border="0" style="width:100%">
  <tr>
    <td style="width:570px" valign="top">
      <div class="chonpet">
        <div class="tabbed_area">
       <ul class="tabs">
            <li><a href="#1" title="content_1" class="tab active">EMO MÉO 1</a></li>
            <li><a href="#2" title="content_2" class="tab">EMO MÉO 2</a></li>
        </ul>
       
        <div id="content_1" class="content">
            <div class="gianhang">
          <label>
            <input type="checkbox" name="item" class="item" />
            <img alt="item" src="http://i.imgur.com/peNYpHh.jpg" />
        </label>
        <label>
            <input type="checkbox" name="item" class="item" />
            <img alt="item" src="http://i.imgur.com/aUAn9JZ.jpg" />
        </label>
        <label>
            <input type="checkbox" name="item" class="item" />
            <img alt="item" src="http://i.imgur.com/TDIdQFQ.jpg" />
        </label>
        <label>
            <input type="checkbox" name="item" class="item" />
            <img alt="item" src="http://i.imgur.com/pjwIkFz.jpg" />
        </label>
     </div>
        </div>
        <div id="content_2" class="content">
            <div class="gianhang">
          <label>
            <input type="checkbox" name="item" class="item" />
      <img src="http://i.imgur.com/KSEvDV3.jpg"/>
          </label>
          <label>
            <input type="checkbox" name="item" class="item" />
      <img src="http://i.imgur.com/dI9F4RA.jpg"/>
          </label>
          <label>
            <input type="checkbox" name="item" class="item" />
      <img src="http://i.imgur.com/qKhd9RU.jpg"/>
          </label>
          <label>
            <input type="checkbox" name="item" class="item" />
      <img src="http://i.imgur.com/VGX73kB.jpg"/>
          </label>
          <label>
            <input type="checkbox" name="item" class="item" />
      <img src="http://i.imgur.com/vbJMG79.jpg"/>
          </label>
     </div>
        </div>
   
    </div>
     
  </div>
      <div class="headne">COPYRIGHT</div>
    <div class="cprshop">
      Shop auto chọn nhiều pet © FCAmusement - VnIcefox 2014<br/>
Thiết kế: Méo Hắc Hắc (NCat) - K.<br/>
Cùng với sự giúp đỡ đắc lực của Zzbaivong - Devs.cf<br/>
Vui lòng không rip code dưới mọi hình thức</div></td><td valign="top">
  <div id="cart">
<div class="headxem">GIỎ HÀNG (<span class="num">0</span>)</div>
<div class="xempetne"></div>
    <div class="tongtien">Tổng tiền: 0 Points</div>
  </div>
<div class="headxem">THÔNG TIN</div>
<div class="thongtinkhach">
Tên khách hàng: <span class="USERLINK" id="namene"></span><br />
Tài khoản: <span class="mypoint"></span> Points<br/>
Bài gửi: <span class="USERCOUNTPOST"></span> Bài
</div>
<!-- BEGIN switch_user_logged_out --><div class="muapet">
   <form id="abc" action="/post" class="frm-form" method="post" name="post" enctype="multipart/form-data">
        <div class="main-content frm">
                <input id="tieudepet" style="display:none" type="text" name="subject" value="" maxlength="255" title="The length of the title for this topic must be ranging between 10 and 255 characters" onkeypress="if (event.keyCode==13){return false}" />
                <script type="text/javascript">
                  //<![CDATA[
                  input = document.getElementsByName('subject');//]]>
                </script>
             <!-- Edit Textarea -->
              <textarea id="text_editor_textarea" name="message" style="display:none"></textarea>
             <!-- Edit Textarea -->
              <input type="hidden" name="mode" value="newtopic" />
              <input type="hidden" name="f" value="7" />
              <input type="hidden" name="lt" value="0" />
              <input id="submit" type="submit" name="post" value="Gửi hóa đơn" tabindex="6" accesskey="s" />
        </div>   
   </form>
</div><!-- END switch_user_logged_out -->
  </td></tr></table>

<script>
  $(".mypoint").load($(".name a").attr("href") + " #field_id-13 .field_uneditable");
  $("#submit").click(function(){
  $("#tieudepet").val("Hóa đơn của " + $('span.USERLINK a').html());});
 
</script>
<style>
.cprshop {border: 2px solid #3C6432;padding: 17px 20px;color: #3C6432;font-weight: bold;background: #CFE2CA;}
.caigiday {background: #6CA05F;padding: 20px;text-align: center;}
button, input[type="submit"] {cursor:pointer;outline:none!important}
div.chonpet img {cursor:pointer;}
#submit {display:none;background: #A05F96;padding: 5px;border: 0;color: #fff;font-size: 16px;font-weight: bold;font-family: 'Roboto' , sans-serif;box-sizing: inherit;width: 100%;margin-left: -1px;margin-top: -1px;}
.muapet {margin-left: 10px;width: calc(90% + 6px);margin-top:10px}
div.xempetne img {width: 75px;padding: 7px;}
.gianhang {overflow-y: scroll;overflow-x: hidden!important;border: 2px solid #816E52;background: #C5B091;padding: 5px;height: 220px;}
.gianhang img {padding: 4px;}
.gianhang .item {display: none;}
.gianhang .item + img {box-shadow: 0 0 0px transparent;}
.gianhang .item:checked + img {box-shadow: 0 0 5px #000;}
.headxem {padding: 7px;background: cadetblue;color: #fff;font-weight: bold;margin-top:10px;width: 90%;background: cadetblue;color: #fff;font-weight: bold;margin-left: 10px;}
.headxem:first-child {margin-top:0}
div.xempetne {border: 2px solid cadetblue;border-top:0;padding: 5px;overflow-y: scroll;overflow-x: hidden!important;background: #C4DEDF;height: 221px;width: 90%;margin-left: 10px;}
.lamlaine {background: rgb(76, 125, 126);padding: 5px;border: 0;color: #fff;font-weight: bold;float: right;margin-top: -4px;font-size: 14px;}
.headne {padding: 7px 10px;color: #fff;background: #3C6432;font-weight: bold;margin-top: 10px;}
.mypoint .field_uneditable {display: inline-block;}
.thongtinkhach {padding: 5px;border: 2px solid cadetblue;margin-left: 10px;width: 90%;}

  /**/ 
#tabbed_box_1{margin:0 auto 0 auto;width:300px}
.tabbed_box h4{font-family:Arial,Helvetica,sans-serif;font-size:23px;color:#fff;letter-spacing:-1px;margin-bottom:10px}
.tabbed_box h4 small{color:#e3e9ec;font-weight:normal;font-size:9px;font-family:Verdana,Arial,Helvetica,sans-serif;text-transform:uppercase;position:relative;top:-4px;left:6px;letter-spacing:0}
ul.tabs {height: 31px;background: #A0865F;margin: 0;padding: 0;}
ul.tabs li:first-child a {margin-left: 10px;}
ul.tabs li {margin-top: 7px;list-style: none;display: inline-block;}
ul.tabs li a {background: #64543C;padding: 10px;font-size: 9px;font-weight: bold;color: #fff!important;font-family: 'Roboto', sans-serif;}
ul.tabs li a.active {background: #7C6B52;}
#content_2,#content_3,#content_4,#content_5,#content_6,#content_7,#content_8,#content_9,#content_10{display:none}
.content ul{margin:0;padding:0 20px}
.content ul li{list-style:none;border-bottom:1px solid #d6dde0;padding-top:15px;padding-bottom:15px;font-size:13px}
.content ul li:last-child{border-bottom:none}
.content ul li a{text-decoration:none;color:#3e4346}
.content ul li a small{color:#8b959c;font-size:9px;text-transform:uppercase;font-family:Verdana,Arial,Helvetica,sans-serif;position:relative;left:4px;top:0}
.content ul li a:hover{color:#a59c83}
.content ul li a:hover small{color:#baae8e}
.tongtien {padding: 5px 10px;margin-top: 10px;margin-left: 10px;border: 2px solid #A05F5F;color:#A05F5F}
</style>

<script>
$(".gianhang .item").change(function () {
$("div.xempetne").html($(".item:checked + img").clone());
$("#cart .num").text($(".item:checked + img").length);
var bill = "";
$("div.xempetne img").each(function(){
bill += "[img]" + this.src + "[/img]";
});
$("#text_editor_textarea").val(bill + '\n\n Tổng tiền: ' + $(".item:checked + img").length*100 + ' Points');
$(".item:checked").length ? $("#submit").fadeIn(250) : $("#submit").fadeOut(250);
});
</script>
<script>
$(document).ready(function(){
// Sự kiện khi nhấn vào các tab của menu
$("a.tab").click(function () {
// tắt tất cả các tab
$(".active").removeClass("active");
// bật tab đang click lên
$(this).addClass("active");
// tạo hiệu ứng trượt lên trên cho nội dung của tab đang click
$(".content").hide();
// Nếu là tab đầu tiên thì set hiệu ứng là trượt xuống dưới
var content_show = $(this).attr("title");
$("#"+content_show).show();
});
});

$(window).load(function(){
if (Number($(".mypoint .field_uneditable").text()) >100) {
}
else {
alert("Xin lỗi bạn cần ít nhất 100 $ để thực hiện các chức năng trong Shop");
location.href="/forum";
}
});
$(".gianhang .item").change(function () {
$(".tongtien").text('Tổng tiền: ' + $("div.xempetne img").length*100 + ' Points');
if($("div.xempetne img").length*100 > Number($(".mypoint .field_uneditable").text())){alert('Bạn không đủ tiền để mua hết vật phẩm đã chọn\nHãy chọn lại cho phù hợp túi tiền của bạn')}
else{}
});
</script>

Thay 7 bằng id box muốn gửi hóa đơn trong đoạn
Code:

<input type="hidden" name="f" value="7" />

Lưu ý: ai chưa gán Variable cho forum thì thêm đoạn này vào cuối HTML:
Code:
<script type="text/javascript" src="http://yourjavascript.com/156126353119/fmvar.js"></script>
The author of this message was banned from the forum - See the message
  Bài viết hay nhất52
suốt ngày mở miệng nói lỗi lỗi lỗi với lỗi, đưa cái link lỗi đây ta mới biết nó lỗi chỗ nào được chưa?
The author of this message was banned from the forum - See the message
  Bài viết hay nhất54
nick test đâu?
  Bài viết hay nhất55
Mà Méo không viết thêm code mua xong tự cập nhật vô profile a? chỉ mua auto thôi hử o.O
  Bài viết hay nhất56
nếu muốn cập nhật vô profile thì phải dùng profile field, còn đa số toàn là character sheet sao mà làm được
The author of this message was banned from the forum - See the message
  Bài viết hay nhất58
Thêm thử cái này vào trong cuối code shop xem @Gang :
Code:
$(function(){$('.mypoint').load('/u'+_userdata["user_id"]+' #field_id-13 .field_uneditable')});
The author of this message was banned from the forum - See the message
  Bài viết hay nhất60
Thế còn cái này?
Code:
$('.mypoint').load('/u'+_userdata["user_id"]+' #field_id-13 .field_uneditable')
Ta thử thấy nó lên
The author of this message was banned from the forum - See the message
  Bài viết hay nhất62
Méo có thể viết thêm code cập nhật pet vào profile field dc hok ạ? dc thì cảm ơn nhiều lắm, chứ mem càng ngày càg đông add thủ công oải quá :(
  Bài viết hay nhất63
@NCat
Bạn cho mình hỏi với :)
Nếu như mình có 2 tab là Emo Méo 1 với Emo Méo 2
Nhưng mình muốn khi mua đồ ở tab Emo Méo 2 mất 1000 points còn ở Emo Méo 1 chỉ mất 500 point thôi
Làm được không hả bạn ?
  Bài viết hay nhất64
@Yasuo Hiện tại là không :v tại mình tính theo cách là lấy số hàng đã chọn nhân với 100 để ra số tiền, ví dụ chọn 5 món thì sẽ thành 500 Xu chẳng hạn :v
  Bài viết hay nhất65
Cho mình hỏi ngoài lề với @NCat ơi :)
Code này
Code:
$(function(){$('.mypoint').load('/u'+_userdata["user_id"]+' #field_id-13 .field_uneditable')});

Có sử dụng được trong viewtopic_body không z ?
  Bài viết hay nhất66
Viewtopic_body có sẵn trong khung profile rồi thì dùng làm gì nữa @@
  Bài viết hay nhất67
NCat wrote:Viewtopic_body có sẵn trong khung profile rồi thì dùng làm gì nữa @@
Mình dùng để lấy field id khác :)
Nhưng mà mình dùng code đó trên thì nó không hiện
The author of this message was banned from the forum - See the message
  Bài viết hay nhất69
Tự add vào profile field thì đượ chứ vào character sheet thì chờ huynh vống đi :v
The author of this message was banned from the forum - See the message
  Bài viết hay nhất71
NCat wrote:Tự add vào profile field thì đượ chứ vào character sheet thì chờ huynh vống đi :v

Vậy Méo viết code add vô profile field cho cái shop trên dc hok ạ? chứ mình thử ghép từ nhữg shop khác vào mà chả chịu hiện :D chỉ cần auto cập nhật trong profile thì có thể tùy biến hiển thị mà :)
  Bài viết hay nhất72
Hiện tại méo đang làm cái shop mới chọn một pet tự thêm nhưng chưa xong, ráng đợi đi -_-
Cái phần chứa code pet để gửi bài là huynh vống giúp nên từ từ rồi méo mới nghiên cứu và phát triển được
  Bài viết hay nhất73
NCat wrote:Hiện tại méo đang làm cái shop mới chọn một pet tự thêm nhưng chưa xong, ráng đợi đi -_-
Cái phần chứa code pet để gửi bài là huynh vống giúp nên từ từ rồi méo mới nghiên cứu và phát triển được
Hóng :)
Đang cần cái này :v
The author of this message was banned from the forum - See the message
  Bài viết hay nhất75
@NCat ơi
H mình muốn add cái item trong shop = jquery thì làm như thế nào ?
Như kiểu gọi
Code:
dir=imgur.com/
boom[0]="<label><input class='item' name='item' type='checkbox' /><img src='"+dir+"0.gif'></label>";
You cannot reply to topics in this forum