Wednesday 22 July 2015

Accordion in Web Form

Accordion ini kalo dalam pikiran ku sih kayak drop downlist lah simple nya.
Jadi kalo kita click button tertentu, akan muncul informasi tambahan di bawah nya.
terserah sih mau dibuat dimana, hehehe...

Kira-kira seperti ini tampilan nya.

Jadi pada saat User click Waktu Tunggu maka akan muncul CheckBoxList seperti pada gambar di atas.

 @{string id_pertanyaan = "";
        int step = 0;
    }
   @using (Html.BeginForm("InsertTransaksi", "T_Transaksi", FormMethod.Post))
    {

    foreach (System.Data.DataRow item in Model)
    {
        step = step + 1;
        id_pertanyaan = Html.Encode(item[0]);
        <div class="accordion" id="accordion2">
            <div class="accordion-group">
                <div class="accordion-heading">
                    <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapse_@step">
                        <table class="table1" align="center">
                            <tr>
                                <td>

                                    <div class="ukuranfont"><button id="btnPertanyaan" class="paddingClass" name="pilihPertanyaan" value="@Html.Encode(item[0])" style="margin-right:40px; margin-bottom:10px;width:450px; border-radius:8px; border-width:3px; border-color:blueviolet" onclick="">@Html.Encode(item[1])</button></div>


                                </td>
                            </tr>
                        </table>
                    </a>
                </div>
                <div id="collapse_@step" class="accordion-body collapse">
                    <div class="accordion-inner">
                        <table class="table1" align="center">
                            <tr>
                              
                                <td>
                                    @{
                                        WebAppSatisfactionOfCustomers.Models.Detail_Pertanyaan dp = new WebAppSatisfactionOfCustomers.Models.Detail_Pertanyaan();
                                        System.Data.DataSet dsDetailPertanyaan = new System.Data.DataSet();
                                        System.Data.DataTable dtDetailPertanyaan = new System.Data.DataTable();

                                        dsDetailPertanyaan = dp.GetDataBYIdPertanyaan(id_pertanyaan);
                                        dtDetailPertanyaan = dsDetailPertanyaan.Tables[0];
                                        string sDetailPertanyaan = "";
                                        string IdDetail = "";
                                        foreach (System.Data.DataRow drDetailPertanyaan in dtDetailPertanyaan.Rows)
                                        {
                                            sDetailPertanyaan = drDetailPertanyaan["nama_detail_pertanyaan"].ToString();
                                            IdDetail = drDetailPertanyaan["id_detail_pertanyaan"].ToString();
                                            <div class="styleFont"><input id="chkDetailPertanyaan" name="chkDetailPertanyaan" type="checkbox" value="@IdDetail" style="margin-right:20px; margin-bottom:6px" />@sDetailPertanyaan</div>
                                        }
                                    }
                                  

                                </td>
                            </tr>
                        </table>
                    </div>
                </div>
            </div>

        </div>


Semoga bermanfaat :)




Bed Information => Searching

Aku lagi mengerjakan fungsi Search atau dalam aplikasi ini disebut sebagai Bed Information.
Jadi dengan fungsi ini, si Perawat bisa melihat Bed yang mana-mana saja yang sedang digunakan dan sedang dibersihkan.
Kira-kira begini bentuk nya.

Bed Information


Nahh, jadi si Perawat dapat melakukan pencarian dengan hanya memilih Class Name atau Room Name atau Bed Name atau Start Date atau End Date atau bisa juga digabung-gabung, misalnya berdasarkan Class Name dan Room Name atau Room Name dan Bed Name.

Kalo dulu, aku buat semua kondisi nya dimana "stored procedure" dengan menggunakan IF CONDITION.
Kebayang kan, harus membuat beberapa kombinasi kemungkinan yang harus ditulis didalamnya. -___-












Dan solusinya adalah :

1. Pada saat si User menekan button Searh, tampung semua parameter yang TIDAK bernilai NULL dalam sebuah ArrayList.
Kira-kira seperti ini :

if (class_name.Equals("") || class_name.Equals(null))
                {
                   
                }
                else
                {
                    sClass = "CR.Class_Id = '" + class_name +"'";
                    Query.Add(sClass);

                }
                if (room_name.Equals("") || room_name.Equals(null))
                {
                

                }
                else
                {
                    sRoom = "CR.Room_Id = '" + room_name +"'";
                    Query.Add(sRoom);

                }
                if (bed_name.Equals("") || bed_name.Equals(null))
                {
                  
                }
                else
                {
                    sBed = "BR.Bed_Id = '" + bed_name +"'";
                    Query.Add(sBed);

                }
                if (!dStartDate.Equals(null))
                {

                    string startdate = "DATEADD(day, DATEDIFF(day, 0, T.Start_Date), 0)>= '" + dStartDate.ToString() + "'";
                    Query.Add(startdate);

                }
                if (!dEndDate.Equals(null))
                {
                    string enddate  = "DATEADD(day, DATEDIFF(day, 0, T.End_Date), 0)<= '" + dEndDate.ToString() +"'";
                    Query.Add(enddate);

                   
                }
               
                model = bed.GetDataInformation(Query);

 
2. Perlu diperhatikan pada saat menambahkan ke ArrayList, saya sudah set terlebih dahulu bagaimana kondisi nya.
Selanjutnya, kirim ArraryList tadi ke sebuah Model.
Kira-kira seperti ini :
 public DataSet GetDataInformation(ArrayList Arr)
        {
            conn = objDBConnector.GetConn();
            cmd = objDBConnector.GetCommand();

            string sClass = null;
            string sRoom = null;
            string sBed = null;
            DateTime? date = null;

            int i = 0;
            string text = null;
            string temp = null;
            string query = null;
            string conca = "AND ";
            cmd.CommandType = CommandType.StoredProcedure;
            cmd.CommandText = "usp_BedQuery#GetData1";

            for (i = 0; i <= Arr.Count - 1; i++)
            {
                text = Arr[i].ToString();

                temp = temp + text + ' ';
                if ( i < Arr.Count - 1)
                {
                    temp = temp + conca;
                }
            }
            query = temp;
          
            cmd.Parameters.AddWithValue("@query", query);

            SqlDataAdapter da = new SqlDataAdapter();

            da.SelectCommand = cmd;

            da.Fill(dataset);

            return dataset;

        }

3. Setelah langkah 1 dan 2, sekarang tinggal bagaimana Stored Procedure kita menerima parameter String yang kita lempar melalui model.
Kira-kira seperti ini :
ALTER PROC [dbo].[usp_BedQuery#GetData1]
(
    @query varchar(500)
)
AS
BEGIN
    SET NOCOUNT ON
   
    exec ('SELECT Distinct CR.Class_Id, C.Class_Name,CR.Room_Id, R.Room_Name, BR.Bed_Id, B.Bed_Name, T.Status_Bed_Id,SB.Status_Bed_Name, T.Start_Date, T.End_Date
        from M_Class C
        join Map_Class_Room CR
        on CR.Class_Id = C.Class_Id
        join M_Room R
        on CR.Room_Id = R.Room_Id
        join Map_Bed_Room BR
        on CR.Room_Id = BR.Room_Id
        join M_Bed B
        on BR.Bed_Id = B.Bed_Id
        join Map_Bed_Status BS
        on B.Bed_Id = BS.Bed_Id
        join T_Bed_Management T
        on CR.Class_Id = T.Class_Id
        join M_Status_Bed SB
        on T.Status_Bed_Id = SB.Status_Bed_Id
        where ' +@query)
   
END


4. Dengan seperti ini, kita gak perlu buat kombinasi-kombinasi dengan menggunakan IF lagi di stored procedure.

Semoga bisa membantu :) :)

Fighting :)

White