I am using a sap.m.Dialog and also want to use three buttons. For this I am using the buttons aggregation.
In this situation the problem is that it is not responsive on a phone. What can I do to fix this.
Below is an image of the problem
Screenshot 1
Screenshot 2
Dialog Code
<core:FragmentDefinition
xmlns="sap.m"
xmlns:l="sap.ui.layout"
xmlns:f="sap.ui.layout.form"
xmlns:core="sap.ui.core">
<Dialog title="{i18n>ARACBILGILERIEKLE}" draggable="true" stretch="{device>/isPhone}" verticalScrolling="true">
<f:SimpleForm id="AracBilgileriSimpleForm"
editable="false"
layout="ResponsiveGridLayout"
labelSpanXL="3"
labelSpanL="3"
labelSpanM="3"
labelSpanS="12"
adjustLabelSpan="false"
emptySpanXL="4"
emptySpanL="4"
emptySpanM="4"
emptySpanS="0"
columnsXL="2"
columnsL="1"
columnsM="1"
singleContainerFullSize="false" >
<f:content>
<Label text="{i18n>AKTIFARAC}" />
<CheckBox id="aktifAracCheckBoxID" select="onChangeAktifArac"/>
<Label text="{i18n>ARACTIPI}"/>
<Input id="aracModeliInputID"
value="{aracBilgileri>/AracTipi}"
showValueHelp="true"
valueHelpOnly="true"
valueHelpRequest="onGetValueHelpMarkaModel"/>
<Label text="{i18n>MODELYILI}" />
<ComboBox
id="modelYiliComboID"
items="{ path:'/CustomizingYilSet' }"
selectedKey="{aracBilgileri>/ModelYili}"
change="onChangeModelYili">
<core:Item key="{Key}" text="{Value}" />
</ComboBox>
<Label text="{i18n>SASINO}"/>
<Input id="sasiNoID" maxLength="30" value="{aracBilgileri>/SasiNo}"/>
<Label text="{i18n>SATISTARIHI}"/>
<DatePicker
id="satisTarihiID"
value="{path:'aracBilgileri>/SatisTarihi', type:'sap.ui.model.type.Date', formatOptions: { style: 'medium', strictParsing: true}}"
class="sapUiSmallMarginBottom"/>
</f:content>
</f:SimpleForm>
<buttons width="auto" class="sapUiNoMarginBegin
sapUiNoMarginEnd">
<Button id="updateButtonID" type="Emphasized" icon="sap-icon://save" press="onUpdateAracBilgileri" />
<Button id="createButtonID" type="Emphasized" icon="sap-icon://add" press="onCreateAracBilgileri" />
<Button icon="sap-icon://decline" press="aracBilgileriCancel" />
</buttons>
</Dialog>
</core:FragmentDefinition>
Related
Hi so I'm learning about razor, and razor pages; and I'm working on adding items to a simple db.
I noticed something odd with the input in my form when I try to enter a Quantity (should be a int) it throws an error when I press 1 or any number; and says it should be string/Array/collection? Whats that about??
code excerpt from Products.razor:
#if (products != null) // Insert form
{
<EditForm Model="#product" OnValidSubmit="#HandleAdd">
<DataAnnotationsValidator />
<ValidationSummary />
<InputText placeholder="Product Name" id="ProductName" #bind-Value="#product.ProductName" />
<br />
<InputText placeholder="Unit of Measurement" id="Unit" #bind-Value="#product.Unit" />
<br />
<InputNumber min="1" step="1" placeholder="Quantity" id="Quantity" #bind-Value="#product.Quantity" />
<br />
<InputNumber min="0.01" step="0.01" placeholder="Unit Price" id="UnitPrice" #bind-Value="#product.UnitPrice" />
<br />
<InputText placeholder="Category" id="Category" #bind-Value="#product.Category" />
<br />
<button type="submit">Submit</button>
</EditForm>
Wierd error in colsole:
I did notice someone had an idea on a un-related question:
Blazor EditForm adding InputNumber fields
But I treid that and its still not working; and additionally with this form code; now the little green border box indicating valid input doesnt light up.
Any help would be appreciated :D
Made a mistake in the constrution of my Product class applying a [MaxLength] attribute to my Quantity.
Removed it, add new migrations, and now it works :)
I'll like to make a MDBInput smaller. I have :
<MDBInput className="w-100 p-3 h-25" type="text" label="URL Enunciat" name="name" value={quiz.name} />
but I'll like to reduce also the height and font size. but how?
tried that:
.test1{
height:30px;
font-size:9px;
}
<MDBInput className="test1" type="text" label="URL Enunciat" name="name" value={quiz.name} />
but did not work!
Thanks
I would like to have the yes radiobutton to be optional and not to required the comments. This is what I have . what would it be the easiest way to have this value optional and leave the NO radiobutton as it is ?
<Field
component={RadioGroup}
name="result"
required={true}
options={[
{ title: 'Yes', value: 'yes'},
{ title: 'No', value: 'no' },
]}
/>
</div>
</div>
<hr className="hr-line" />
<div className="txt-area">
<Field
name="comments"
type="text"
component={renderTextField}
label="Enter Comments Here"
validate={[required]}
/>
</div>
<hr className="hr-line" />
<div className="d-flex flex-row-reverse ">
<Button type="submit" className="btn-group w-25" size="sm" color="primary" disabled={pristine || submitting}>Save Changes</Button>
We have checked with the provided code and noticed that Syncfusion Components were not used over here. The functionalities provided in the default Radio Button is also available with our Syncfusion Components.
Refer to the below links to know more about Radio Button component.
Demo: https://ej2.syncfusion.com/react/demos/#/material/button/radio-button
Documentation: https://ej2.syncfusion.com/react/documentation/radio-button/getting-started/
API: https://ej2.syncfusion.com/react/documentation/api/radio-button/
Please check with the above links and provide us an example based upon your requirement. We have also attached a sample here for your reference.
https://www.syncfusion.com/downloads/support/directtrac/general/ze/RadioButton1391065099
Please get back to us if you need further assistance.
Regards,
Keerthana.
I added a flag, but for some reason the window doesn’t close when choosing a date
https://www.npmjs.com/package/react-datepicker
<label className="label-block">
<DatePicker
selected={date}
onChange={handleChange}
placeholderText="Выберите день"
minDate={moment().toDate()}
shouldCloseOnSelect={true}
/>
</label>
keep it out of label tag easy.
I am looking at picking a date in Primefaces Mobile with "calendar" component:
<p:calendar value="#{bean.date}" pattern="MM/dd/yyyy HH:mm" />
The calendar pops up but it looks very odd. It overlaps the page content in a transparent way.
Is there a work around for this issue? Or a way to get it pop up correctly inside a dialog? Maybe to combine another framework with Primefaces?
By the way, the dialog seems not to work too in Primefaces Mobile.
Thanks
Primefaces Mobile is really great and is still under development but it doesn't implement Jquery mobile extensions like "datebox". I find a way to combine both. I included the jquery-datebox library in the header of a JSF page (see link):
<f:view xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:pm="http://primefaces.prime.com.tr/mobile"
xmlns:p="http://primefaces.prime.com.tr/ui"
contentType="text/html">
<pm:page title="Faces">
<f:facet name="postinit">
<h:outputStylesheet library="css" name="jquery.mobile-1.0b3.min.css" />
<h:outputStylesheet library="css" name="jquery.mobile.datebox.min.css" />
<h:outputScript library="primefaces" name="mobile/mobile.js" />
<h:outputScript library="js" name="jquery.mobile.datebox.min.js" />
</f:facet>
<!-- Main View -->
<pm:view id="main" swatch="b">
<pm:header title="Hello">
<f:facet name="left">
<pm:button value="Back" icon="back" role="back"/>
</f:facet>
</pm:header>
<pm:content>
<h:form id="myform">
<h:outputText value="Input: " />
<h:inputText id="input" />
</h:form>
</pm:content>
<label for="mydate">Date: </label>
<input name="mydate" id="mydate" type="date" data-role="datebox" value="#{mybean.date}"
data-options='{"mode": "calbox"}' />
<div data-role="fieldcontain">
<label for="slider">Duration: </label>
<input type="range" name="slider" id="slider"
value="#{mybean.duration}" min="1" max="10" />
</div>
<pm:content>
<h:form id="Form">
<pm:field>
<h:outputLabel for="duration" value="duration: "/>
<pm:slider id="duration" min="1" max="10" value="#{mybean.duration}"/>
</pm:field>
</h:form>
</pm:content>
</pm:view>
</pm:page>
</f:view>
The datepicker works well but both sliders inside and outside a pm-view (see the code) are displayed like normal inputs!
Any suggestions? Thanks
PS: #administrator: a new tag is needed: "Primefaces-mobile"