mvc-responsive-web-application/CS/MvcResponsiveWebApplication/Views/FormLayout/FirstPagePartial.cshtml at 18.2.4+ · LanaDX/mvc-responsive-web-application · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
<div class="formLayoutContainer">
    @Html.DevExpress().FormLayout(settings => {
    settings.Name = "FormLayout";
    settings.Width = Unit.Percentage(100);
    var groupItem = settings.Items.AddGroupItem(groupSettings => {
        groupSettings.Caption = "Some Form";
        groupSettings.Width = Unit.Percentage(100);
        groupSettings.ColumnCount = 3;
    });
    groupItem.GridSettings.StretchLastItem = DefaultBoolean.True;
    groupItem.GridSettings.WrapCaptionAtWidth = 660;
    groupItem.GridSettings.Breakpoints.Add(new LayoutBreakpoint() { Name = "S", ColumnCount = 1, MaxWidth = 500 });
    groupItem.GridSettings.Breakpoints.Add(new LayoutBreakpoint() { Name = "M", ColumnCount = 2, MaxWidth = 800 });
    groupItem.Items.Add(i => {
        i.Caption = "First name";
        i.VerticalAlign = FormLayoutVerticalAlign.Middle;
        i.NestedExtension().TextBox(s => {
            s.Name = "FirstNameTextBox";
            s.Width = Unit.Percentage(100);
        });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "S", ColumnSpan = 1, RowSpan = 1 });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "M", ColumnSpan = 2, RowSpan = 1 });
    });
    groupItem.Items.Add(i => {
        i.Caption = "Last name";
        i.VerticalAlign = FormLayoutVerticalAlign.Middle;
        i.NestedExtension().TextBox(s => {
            s.Name = "LastNameTextBox";
            s.Width = Unit.Percentage(100);
        });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "S", ColumnSpan = 1, RowSpan = 1 });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "M", ColumnSpan = 1, RowSpan = 1 });
    });
    groupItem.Items.Add(i => {
        i.Caption = "Birthday";
        i.VerticalAlign = FormLayoutVerticalAlign.Middle;
        i.NestedExtension().DateEdit(s => {
            s.Name = "BirthdayDateEdit";
            s.Width = Unit.Percentage(100);
            s.Properties.Password = true;
        });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "S", ColumnSpan = 1, RowSpan = 1 });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "M", ColumnSpan = 1, RowSpan = 1 });
    });
    groupItem.Items.Add(i =>
    {
        i.Caption = "Email";
        i.VerticalAlign = FormLayoutVerticalAlign.Middle;
        i.NestedExtension().TextBox(s =>
        {
            s.Name = "EmailTextBox";
            s.Width = Unit.Percentage(100);
        });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "S", ColumnSpan = 1, RowSpan = 1 });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "M", ColumnSpan = 1, RowSpan = 1 });
    });
    groupItem.Items.Add(i =>
    {
        i.Caption = "Phone 1";
        i.VerticalAlign = FormLayoutVerticalAlign.Middle;
        i.NestedExtension().TextBox(s =>
        {
            s.Name = "Phone1TextBox";
            s.Width = Unit.Percentage(100);
        });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "S", ColumnSpan = 1, RowSpan = 1 });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "M", ColumnSpan = 1, RowSpan = 1 });
    });
    groupItem.Items.Add(i =>
    {
        i.Caption = "Phone 2";
        i.VerticalAlign = FormLayoutVerticalAlign.Middle;
        i.NestedExtension().TextBox(s =>
        {
            s.Name = "Phone2TextBox";
            s.Width = Unit.Percentage(100);
        });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "S", ColumnSpan = 1, RowSpan = 1 });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "M", ColumnSpan = 1, RowSpan = 1 });
    });
    groupItem.Items.Add(i => {
        i.Caption = "Country";
        i.ColumnSpan = 2;
        i.VerticalAlign = FormLayoutVerticalAlign.Middle;
        i.NestedExtension().ComboBox(s => {
            s.Name = "CountryComboBox";
            s.Width = Unit.Percentage(100);
        });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "S", ColumnSpan = 1, RowSpan = 1 });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "M", ColumnSpan = 1, RowSpan = 1 });

    });
    groupItem.Items.Add(i => {
        i.Caption = "Address";
        i.RowSpan = 2;
        i.NestedExtension().Memo(s => {
            s.Name = "AddressMemo";
            s.Height = Unit.Percentage(100);
            s.Width = Unit.Percentage(100);
        });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "S", ColumnSpan = 1, RowSpan = 1 });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "M", ColumnSpan = 1, RowSpan = 2 });
    });
    groupItem.Items.Add(i => {
        i.Caption = "City";
        i.ColumnSpan = 2;
        i.VerticalAlign = FormLayoutVerticalAlign.Middle;
        i.NestedExtension().TextBox(s => {
            s.Name = "CityTextBox";
            s.Width = Unit.Percentage(100);
        });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "S", ColumnSpan = 1, RowSpan = 1 });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "M", ColumnSpan = 1, RowSpan = 1 });
    });
    groupItem.Items.Add(i => {
        i.ShowCaption = DefaultBoolean.False;
        i.Paddings.PaddingTop = 20;
        i.CssClass = "lastItem";
        i.HorizontalAlign = FormLayoutHorizontalAlign.Right;
        i.VerticalAlign = FormLayoutVerticalAlign.Middle;
        i.NestedExtension().Button(s => {
            s.Name = "SignUpButton";
            s.Text = "Sign Up";
        });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "S", ColumnSpan = 1, RowSpan = 1 });
        i.SpanRules.Add(new SpanRule() { BreakpointName = "M", ColumnSpan = 1, RowSpan = 1 });
    });
}).GetHtml()

    <h2>Some Description</h2>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam ultrices. Quisque porta lorem cursus erat. Mauris at est ac risus tempus consequat. In euismod nisi porta augue. Quisque at est. Duis id libero. Nulla quis erat eu justo adipiscing placerat. Nam lorem.</p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam ultrices. Quisque porta lorem cursus erat. Mauris at est ac risus tempus consequat. In euismod nisi porta augue. Quisque at est. Duis id libero. Nulla quis erat eu justo adipiscing placerat. Nam lorem.</p>

</div>