locked
How to design row GUI RRS feed

  • Question

  • User-1790113996 posted

    Good day to all,

    kindly ask how can i achieve this like this in the picture, please check my screenshot link below, thank you.

    https://imgur.com/a/B1foP

    and also please check my code below, thank you again.

    @model IEnumerable<WarehouseRtoRSystem.Models.BudgetViewModel>
    
    @{
        ViewBag.Title = "Index";
    }
    
    
    <div class="w3-white">
     
        <div class="w3-container">
            <div class="w3-col m12 ">
                <br />
            </div>
            <div class="w3-col m12 ">
                <br />
            </div>
            @using (Html.BeginForm())
            {
                @ViewBag.Message
    
                <label>Month </label>
                <select id="month" name="month">
                    @{ string[] Months = { "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" }; }
                    @for (var i = 0; i < 12; i++)
                    {
                        var m = i + 1;
                        if (Convert.ToInt32(ViewBag.month) == m)
                        {
                            <option value=@m selected>@Months[i]</option>
                        }
                        else
                        {
                            <option value=@m>@Months[i]</option>
                        }
                    }
    
                </select>
    
                <label>YEAR</label>
    
                <select id="year" name="year">
                    @for (var c = 0; c < 1000; c++)
                    {
                        var yr = c + 2017;
                        if (Convert.ToInt32(ViewBag.year) == yr)
                        {
                            <option value=@yr selected>
                                @yr
                            </option>
                        }
                        else
                        {
                            <option value=@yr> @yr</option>
                        }
                    }
                </select>
                <input type="submit" value="Filter" class="btn btn-default" />
            }
            <br />
            <div class="w3-col m12 ">
                <span> @Html.ActionLink("Update Budget", "Create", "Budget", new { @class = "btn btn-default btn-sm" })</span>
                <br />
                <br />
            </div>
            <div class="w3-col m12 table-responsive" style="height: 300px">
                <table class="table w3-white w3-striped w3-border">
                    <tr class="w3-teal ">
                        <th>
                            DATE INSERTED
                        </th>
                        <th>
                            @Html.DisplayNameFor(model => model.DEPARTMENTID)
                        </th>
                        <th>
                            @Html.DisplayNameFor(model => model.DEPARTMENTNAME)
                        </th>
                        <th>
                            @Html.DisplayNameFor(model => model.BUDGET)
                        </th>
    
                        <th>EXPENCE</th>
    
                        <th>BALANCE</th>
                        
                    </tr>
    
                    @foreach (var item in Model)
                    {
                        <tr>
                            <td>
                                @Html.DisplayFor(modelItem => item.DATETIME)
                            </td>
                            <td>
                                @Html.DisplayFor(modelItem => item.DEPARTMENTID)
                            </td>
                            <td>
                                @Html.DisplayFor(modelItem => item.DEPARTMENTNAME)
                            </td>
                            <td>
                                @Html.DisplayFor(modelItem => item.BUDGET)
                            </td>
    
                            <td>
                                @Html.DisplayFor(modelItem => item.EXPENCES)
                               
                            </td>
                            <td>
                                 @Html.DisplayFor(modelItem => item.BALANCE)
                            </td>
    
    
                        </tr>
                    }
    
                </table>
            </div>
    
            <div class="w3-col m12 ">
                @Html.ActionLink("Export to Excel", "GenerateExcels", "Budget", new { @class = "w3-btn btn-primary btn-sm" })
    
            </div>
           
        </div>
      
       
    </div>

    Thursday, December 7, 2017 8:14 AM

All replies

  • User347430248 posted

    Hi Cloudfiers,

    I try to check the image.

    what kind of ui you are talking about is not clear.

    are you talking about to display the textboxes in 2 columns or you want to disable some textboxes?

    let us know about it.

    so that we can try to provide you further suggestions.

    Regards

    Deepak

    Friday, December 8, 2017 7:18 AM
  • User-1790113996 posted

    Hi Cloudfiers,

    I try to check the image.

    what kind of ui you are talking about is not clear.

    are you talking about to display the textboxes in 2 columns or you want to disable some textboxes?

    let us know about it.

    so that we can try to provide you further suggestions.

    Regards

    Deepak

    hi Deepak,

    my problem has been done, we can closed the topic now, thank you I appriciated that.

    Friday, December 8, 2017 9:23 AM