PDA

View Full Version : [CLOSED] Validate FormPanel and Save It using DirectMethods using MVC



Ujvari
Mar 09, 2014, 10:23 PM
Hi,

I have the piece of code below and I want to Save the form using Direct Methods and MVC but I try many samples and nothing seems to work. Could you help me? Please provide and MVC sample on how to save forms and validate it both on client and server side.
Another thing, can I update the Status bar from serve side instead of using Ext.Msg.Show() as I'm using in my controller? If yes, How can I do that.



I notices that there are many examples using Web Forms and just a few using MVC. Even the examples page is much more complete for web forms than for MVC. Is there any good source of material for MVC Ext.NET aside from http://examples2.ext.net/ ?


Thank you very much

Here's the code:


x.Panel()
.Title("Dados Paciente")
.AutoScroll(true)
.Border(false)
.Items(
x.FormPanel()
.ID("frmPaciente")
.Border(false)
.Layout(LayoutType.Fit)
.FieldDefaults(fd =>
{
fd.LabelAlign = LabelAlign.Left;
fd.MsgTarget = MessageTarget.Side;
fd.InvalidText = "Obrigat?rio";
fd.EnforceMaxLength = true;
fd.AutoFitErrors = true;
//fd.AllowBlank = false;
fd.SelectOnFocus = true;
fd.LabelWidth = 150;
})
.ItemsFromPartial("_DadosPaciente", Model.PacienteModel)
)
.Buttons(
x.Button()
.Icon(Icon.Erase)
.Text("Limpar Campos")
.OnClientClick("this.up('frmPaciente').getForm().reset();"),
x.Button()
.Icon(Icon.DatabaseSave)
.Text("Pr?ximo Passo")
.ID("btnSave")
.FormBind(true)
.Type(ButtonType.Submit)
.CausesValidation(true)
.DirectEvents(de =>
{
de.Click.Before = "return #{frmPaciente}.getForm().isValid();";
de.Click.Success = "#{DirectMethods}.SavePaciente()";
})
//.OnClientClick("return #{frmPaciente}.isValid();")
//.DirectClickAction("Save", "Paciente")
).Border(true),

Here's the controller code:


[DirectMethod]
public ActionResult Save(PacienteModel paciente)
{
X.Msg.Show(new MessageBoxConfig
{
Message = "Salvando Paciente, aguarde...",
ProgressText = "Salvando...",
Width = 300,
Wait = true,
WaitConfig = new WaitConfig { Interval = 200 },
IconCls = "ext-mb-download",
AnimEl = this.GetCmp<Button>("btnSave").ClientID,
});

X.AddScript("setTimeout(function () { Ext.MessageBox.hide(); Sucesso('pnlDadosPessoais','Paciente salvo com sucesso!','Informa??o'); }, 4000);");

return this.Direct();
}

Vladimir
Mar 10, 2014, 9:18 AM
Please provide and MVC sample on how to save forms and validate it both on client and server side.

Please see the following samples
http://mvc.ext.net/#/Models/Submit/
http://mvc.ext.net/#/Models/Data_Annotations/
http://mvc.ext.net/#/Models/Model_State/ (online sample doesn't work (it is not updated yet) but you can run it for SVN vesrion)




Another thing, can I update the Status bar from serve side instead of using Ext.Msg.Show() as I'm using in my controller? If yes, How can I do that.

What Status bar do you mean? Ext.Net StatusBar? If yes then see the following sample
http://examples2.ext.net/#/Toolbar/StatusBar/Overview/

Ujvari
Mar 10, 2014, 9:18 PM
Hi,

I'm using Data Annotations as you point out and I receiving a Json as a result of validation but, How can I use this JSON as errors messages inside the form?

7921

Here's the code Now:



public class PacienteModel : IValidatableObject
{
public long Id { get; set; }
public List<Ext.Net.ListItem> PacientesTipos { get; set; }
public List<Ext.Net.ListItem> Etnias { get; set; }
public List<Ext.Net.ListItem> TiposSanguineos { get; set; }
public List<Ext.Net.ListItem> EstadosCivis { get; set; }
public List<ESTADOS> Estados { get; set; }
public List<CIDADES> Cidades { get; set; }
public List<Ext.Net.ListItem> FormasPagtos { get; set; }

[Required(ErrorMessage = "Nome Obrigat?rio")]
public string NomePaciente { get; set; }

[Required(ErrorMessage = "Email Obrigat?rio")]
public string EmailPaciente { get; set; }

[Required(ErrorMessage = "Data de Nascimento Obrigat?ria")]
public DateTime DataNascimento { get; set; }

[Required(ErrorMessage="Idade Obrigat?ria")]
public int Idade { get; set; }
public int QtdFilhos { get; set; }

[Required(ErrorMessage="Por favor, selecione um tipo de paciente")]
public int PacienteTipoId { get; set; }

[Required(ErrorMessage="Por favor, selecione uma etnia para o paciente")]
public int EtniaId { get; set; }

[Required(ErrorMessage="Por favor, selecione um Tipo Sangu?neo")]
public int TipoSanguineoId { get; set; }

[Required(ErrorMessage="Por favor, selecione um Estado Civil")]
public int EstadoCivilId { get; set; }

[Required(ErrorMessage="Por favor, selecione um Estado")]
public int EstadoId { get; set; }

[Required(ErrorMessage="Por favor, selecione uma Cidade")]
public int CidadeId { get; set; }

public int FormaPagtoId { get; set; }

[Required(ErrorMessage = "Endere?o Obrigat?rio")]
public string Endereco { get; set; }

[Required(ErrorMessage = "N?mero Obrigat?rio")]
public string Numero { get; set; }

public string Complemento { get; set; }

[Required(ErrorMessage = "Bairro Obrigat?rio")]
public string Bairro { get; set; }

[Required(ErrorMessage = "Cep Obrigat?rio")]
[MinLength(8)]
[MaxLength(9)]
public string Cep { get; set; }

public PacienteModel()
{
Id = 0;
PacientesTipos = new List<Ext.Net.ListItem>();
Etnias = new List<Ext.Net.ListItem>();
TiposSanguineos = new List<Ext.Net.ListItem>();
EstadosCivis = new List<Ext.Net.ListItem>();
Estados = new List<ESTADOS>();
Cidades = new List<CIDADES>();
FormasPagtos = new List<Ext.Net.ListItem>();
Endereco = string.Empty;
Numero = string.Empty;
Complemento = string.Empty;
Bairro = string.Empty;
Cep = string.Empty;
NomePaciente = string.Empty;
EmailPaciente = string.Empty;
DataNascimento = DateTime.MinValue;
Idade = 0;
QtdFilhos = 0;
PacienteTipoId = 0;
EtniaId = 0;
TipoSanguineoId = 0;
EstadoCivilId = 0;
EstadoId = 0;
CidadeId = 0;
}

public IEnumerable<ValidationResult> Validate(ValidationContext validationContext)
{
yield break;
}




public ActionResult SavePaciente(PacienteModel paciente)
{
if (ModelState.IsValid)
{
X.Msg.Show(new MessageBoxConfig
{
Message = "Salvando Paciente, aguarde...",
ProgressText = "Salvando...",
Width = 300,
Wait = true,
WaitConfig = new WaitConfig { Interval = 200 },
IconCls = "ext-mb-download",
AnimEl = this.GetCmp<Button>("btnSave").ClientID,
});

X.AddScript("setTimeout(function () { Ext.MessageBox.hide(); Sucesso('pnlDadosPessoais','Paciente salvo com sucesso!','Informa??o'); }, 2000);");

}

return this.FormPanel(ModelState);
}

Vladimir
Mar 10, 2014, 9:29 PM
Please provide runable sample demonstrates the issue

To use 'return this.FormPanel(ModelState);' you need to submit form instead direct event using


Handler = "this.up('form').submit();"

See Model State example for details

geoffrey.mcgill
Mar 10, 2014, 9:37 PM
The MVC Examples Explorer (http://mvc.ext.net/) has been updated to the 2.5.0 release.

Ujvari
Mar 11, 2014, 12:02 AM
The MVC Examples Explorer (http://mvc.ext.net/) has been updated to the 2.5.0 release.


The updated examples aren't working as showed in prints below

7951

7961

Ujvari
Mar 11, 2014, 12:05 AM
Please provide runable sample demonstrates the issue

To use 'return this.FormPanel(ModelState);' you need to submit form instead direct event using


Handler = "this.up('form').submit();"

See Model State example for details

The option provided above is not working just because it don't get to my Controller properly. I want to submit the form without using any javascript function to do it. Is that possible?

geoffrey.mcgill
Mar 11, 2014, 12:10 AM
The updated examples aren't working as showed in prints below

I tested the samples linked to above, and they all appear to be functioning correctly.

Ujvari
Mar 11, 2014, 1:36 AM
I tested the samples linked to above, and they all appear to be functioning correctly.

It happens when you click on Source Code.

Daniil
Mar 11, 2014, 7:15 AM
It happens when you click on Source Code.

Thank you for the report. It has been fixed in the revision #5714 and online.

Ujvari
Mar 12, 2014, 4:06 PM
Hi,

I did not received an answer for my question yet. I wanna use my Data Annotation Model to show errors and requirements in my form without using javascript to submit the form. I want to submit the form directly to the controller and after the model is validated just show the proper errors in the form.
Here is my entire code:

This the View that I'm using. As you can see a try many examples from you guys and nothing seems to work. If I use a DirectEvent to submit to my controller it works but, I can't receive the errors back. Simply submiting the form Doesn't work.



x.Panel()
.Title("Dados Paciente")
.ID("pnlDadosPaciente")
.AutoScroll(true)
.Border(false)
.Layout(LayoutType.Fit)
.Items(
x.FormPanel()
.ID("frmPaciente")
.Border(false)
.Layout(LayoutType.Fit)
.FieldDefaults(fd =>
{
fd.LabelAlign = LabelAlign.Left;
fd.MsgTarget = MessageTarget.Side;
fd.InvalidText = "Obrigat?rio";
fd.EnforceMaxLength = true;
fd.AutoFitErrors = true;
//fd.AllowBlank = false;
fd.SelectOnFocus = true;
fd.LabelWidth = 150;
})
.ItemsFromPartial("_DadosPaciente", Model.PacienteModel),
x.DataView()
.Store(
x.ModelStateStore()
.ID("msPaciente")
)
)
.Buttons(
x.Button()
.Icon(Icon.DatabaseSave)
.Text("Salvar Paciente")
.ID("btnSave")
.Disabled(true)
.FormBind(true)
.Type(ButtonType.Submit)
.CausesValidation(true)
//.Handler("#{frmPaciente}.submit();"),
.Handler(@"#{pnlDadosPaciente}.child('dataview').getStore().r emoveAll(); #{frmPaciente}.submit({clientValidation: false});"),
//.DirectEvents(de =>
//{
// de.Click.Url = Url.Action("SavePaciente");
// //de.Click.EventMask.ShowMask = true;
// de.Click.FormID = "frmPaciente";
//})
x.Button()
.Icon(Icon.Erase)
//.Disabled(true)
.ID("btnClear")
.Text("Limpar Campos")
.OnClientClick("#{frmPaciente}.reset();")
).Padding(5),


This is my Model:



public class PacienteModel : IValidatableObject
{
public long Id { get; set; }
public List<Ext.Net.ListItem> PacientesTipos { get; set; }
public List<Ext.Net.ListItem> Etnias { get; set; }
public List<Ext.Net.ListItem> TiposSanguineos { get; set; }
public List<Ext.Net.ListItem> EstadosCivis { get; set; }
public List<ESTADOS> Estados { get; set; }
public List<CIDADES> Cidades { get; set; }
public List<Ext.Net.ListItem> FormasPagtos { get; set; }

[Required(ErrorMessage = "Nome Obrigat?rio")]
public string NomePaciente { get; set; }

[Required(ErrorMessage = "Email Obrigat?rio")]
public string EmailPaciente { get; set; }

[Required(ErrorMessage = "Data de Nascimento Obrigat?ria")]
public DateTime DataNascimento { get; set; }

[Required(ErrorMessage="Idade Obrigat?ria")]
public int Idade { get; set; }
public int QtdFilhos { get; set; }

[Required(ErrorMessage="Por favor, selecione um tipo de paciente")]
public int PacienteTipoId { get; set; }

[Required(ErrorMessage="Por favor, selecione uma etnia para o paciente")]
public int EtniaId { get; set; }

[Required(ErrorMessage="Por favor, selecione um Tipo Sangu?neo")]
public int TipoSanguineoId { get; set; }

[Required(ErrorMessage="Por favor, selecione um Estado Civil")]
public int EstadoCivilId { get; set; }

[Required(ErrorMessage="Por favor, selecione um Estado")]
public int EstadoId { get; set; }

[Required(ErrorMessage="Por favor, selecione uma Cidade")]
public int CidadeId { get; set; }

public int FormaPagtoId { get; set; }

[Required(ErrorMessage = "Endere?o Obrigat?rio")]
public string Endereco { get; set; }

[Required(ErrorMessage = "N?mero Obrigat?rio")]
public string Numero { get; set; }

public string Complemento { get; set; }

[Required(ErrorMessage = "Bairro Obrigat?rio")]
public string Bairro { get; set; }

[Required(ErrorMessage = "Cep Obrigat?rio")]
[MinLength(8)]
[MaxLength(9)]
public string Cep { get; set; }

public PacienteModel()
{
Id = 0;
PacientesTipos = new List<Ext.Net.ListItem>();
Etnias = new List<Ext.Net.ListItem>();
TiposSanguineos = new List<Ext.Net.ListItem>();
EstadosCivis = new List<Ext.Net.ListItem>();
Estados = new List<ESTADOS>();
Cidades = new List<CIDADES>();
FormasPagtos = new List<Ext.Net.ListItem>();
Endereco = string.Empty;
Numero = string.Empty;
Complemento = string.Empty;
Bairro = string.Empty;
Cep = string.Empty;
NomePaciente = string.Empty;
EmailPaciente = string.Empty;
DataNascimento = DateTime.MinValue;
Idade = 0;
QtdFilhos = 0;
PacienteTipoId = 0;
EtniaId = 0;
TipoSanguineoId = 0;
EstadoCivilId = 0;
EstadoId = 0;
CidadeId = 0;
}

public IEnumerable<ValidationResult> Validate(ValidationContext validationContext)
{
yield break;
}
}


And this is my controller:



public ActionResult SavePaciente(PacienteModel paciente)
{
if (ModelState.IsValid)
{
X.Msg.Show(new MessageBoxConfig
{
Message = "Salvando Paciente, aguarde...",
ProgressText = "Salvando...",
Width = 300,
Wait = true,
WaitConfig = new WaitConfig { Interval = 200 },
IconCls = "ext-mb-download",
AnimEl = this.GetCmp<Button>("btnSave").ClientID,
});

X.AddScript("setTimeout(function () { Ext.MessageBox.hide(); Sucesso('pnlDadosPessoais','Paciente salvo com sucesso!','Informa??o'); }, 2000);");

}

this.GetCmp<ModelStateStore>("msPaciente").DataBind();

return this.FormPanel(ModelState);
}


Remember that I'm not creating my form Dynamically using DisplayForModel MVC or EditForModel and this is the code inside the _DadosPaciente partial:



@model VPNUX.FrontEnd.Models.PacienteModel
@{
var x = Html.X();
}
@(

x.TabPanel()
.Border(true)
.Layout(LayoutType.Fit)
.Items(
x.Panel()
.Listeners(list =>
{
list.Activate.Handler = "enableDisableButtons(true);";
})
.Title("Dados Pessoais")
.ID("pnlDadosPessoais")
.Padding(10)
.Layout(LayoutType.Form)
.Border(false)
.Items(
x.TextField()
.AllowBlank(false)
.Name("txtNomePaciente")
.InputWidth(300)
.FieldLabel("Nome"),
x.TextField()
.AllowBlank(false)
.Name("txtEmail")
.InputWidth(300)
.FieldLabel("Email"),
x.DateField()
.InputWidth(100)
.AllowBlank(false)
.Name("txtDataNascimento")
.FieldLabel("Data Nascimento"),
x.RadioGroup()
.ID("rblSexo")
.FieldLabel("Sexo")
.AllowBlank(false)
.Width(300)
.ColumnsNumber(2)
.AutomaticGrouping(false)
.Items(
x.Radio().Name("rblSexo").InputValue("M").BoxLabel("Masculino"),
x.Radio().Name("rblSexo").InputValue("F").BoxLabel("Feminino")
),
x.ComboBox()
.Listeners(listener =>
{
listener.Change.Handler = "changeSexo();";
})
.FieldLabel("Tipo Paciente")
.AllowBlank(false)
.InputWidth(250)
.Items(Model.PacientesTipos)
.ID("ddlTipoPaciente")
.Name("ddlTipoPaciente"),
x.ComboBox()
.FieldLabel("Tipo Sangu?neo")
.AllowBlank(false)
.Items(Model.TiposSanguineos)
.InputWidth(250)
.Name("ddlTipoSanguineo"),
x.ComboBox()
.Items(Model.Etnias)
.FieldLabel("Etnia")
.AllowBlank(false)
.InputWidth(250)
.Name("ddlEtnias"),
x.ComboBox()
.Items(Model.EstadosCivis)
.FieldLabel("Estado Civil")
.AllowBlank(false)
.InputWidth(250)
.Name("ddlEstadoCivil"),
x.NumberField()
.Name("txtIdade")
.InputWidth(100)
.AllowBlank(false)
.AllowDecimals(false)
.FieldLabel("Idade"),
x.NumberField()
.Name("txtQtdFilhos")
.InputWidth(100)
.AllowBlank(true)
.AllowDecimals(false)
.FieldLabel("Qtd. Filhos"),
x.NumberField()
.Name("txtPeso")
.InputWidth(100)
.AllowBlank(false)
.FieldLabel("Peso")
.AllowDecimals(false)
.EmptyText("Kg"),
x.NumberField()
.Name("txtAltura")
.InputWidth(100)
.FieldLabel("Altura")
.AllowBlank(false)
.EmptyText("0,00")
.DecimalPrecision(2)
.AllowDecimals(true)
.DecimalSeparator(","),
x.FileUploadField()
.Name("fupFotoPaciente")
.FieldLabel("Foto Paciente")
.AllowBlank(true)
.ID("fupFotoPaciente")
.Width(500)
.Icon(Icon.Attach),
x.TextField()
.ID("txtIndicacao")
.Margins("0 0 5 0")
.InputWidth(300)
.Name("txtIndicacao")
.FieldLabel("Quem indicou")
.AllowBlank(true),
x.TextField()
.AllowBlank(true)
.Name("txtTelResidencial")
.InputWidth(100)
.FieldLabel("Tel. Residencial")
.Plugins(
x.InputMask()
.Mask("(99) 9999-9999")
),
x.TextField()
.AllowBlank(false)
.Name("txtTelCelular")
.InputWidth(100)
.FieldLabel("Tel. Celular")
.Plugins(
x.InputMask()
.Mask("(99) 9 9999-9999")
),
x.TextField()
.AllowBlank(true)
.Name("txtTelComercial")
.InputWidth(100)
.FieldLabel("Tel. Comercial")
.Plugins(
x.InputMask()
.Mask("(99) 9999-9999")
)
),
x.Panel()
.Title("Endere?o")
.Padding(10)
.Border(false)
.Layout(LayoutType.Form)
.Listeners(list =>
{
list.Activate.Handler = "enableDisableButtons(true);";
})
.Items(
x.TextField()
.Name("txtEndereco")
.InputWidth(400)
.AllowBlank(false)
.FieldLabel("Endere?o"),
x.TextField()
.InputWidth(100)
.Name("txtNumero")
.AllowBlank(false)
.FieldLabel("N?mero"),
x.TextField()
.InputWidth(100)
.Name("txtComplemento")
.AllowBlank(true)
.FieldLabel("Complemento"),
x.TextField()
.InputWidth(200)
.Name("txtBairro")
.AllowBlank(false)
.FieldLabel("Bairro"),
x.ComboBox()
.InputWidth(250)
.Name("ddlEstado")
.AllowBlank(false)
.FieldLabel("Estado"),
x.ComboBox()
.InputWidth(250)
.Name("ddlCidade")
.AllowBlank(false)
.FieldLabel("Cidade")
),
x.Panel()
.Title("Dados Consulta")
.Listeners(list =>
{
list.Activate.Handler = "enableDisableButtons(false);";
})
.Padding(10)
.Border(false)
.Layout(LayoutType.Form)
.Items(
x.RadioGroup()
.ID("rblTipoConsulta")
.FieldLabel("Tipo Consulta")
.LabelWidth(120)
.Width(300)
.ColumnsNumber(2)
.AllowBlank(false)
.AutomaticGrouping(false)
.Items(
x.Radio().Name("rblTipoConsulta").InputValue("Particular").BoxLabel("Particular").Checked(true),
x.Radio().Name("rblTipoConsulta").InputValue("Conv?nio").BoxLabel("Conv?nio")
)
.Listeners(listener => { listener.Change.Handler = "disableFields();";
listener.Render.Handler = "disableFields();";
}),
x.TextField()
.ID("ddlConvenio")
.Name("ddlConvenio")
.LabelWidth(120)
.Disable(true)
.InputWidth(400)
.FieldLabel("Conv?nio"),
x.TextField()
.ID("ddlPlanoConvenio")
.LabelWidth(120)
.InputWidth(400)
.Name("ddlPlanoConvenio")
.FieldLabel("Plano"),
x.TextField()
.ID("txtNumeroCarteira")
.LabelWidth(120)
.InputWidth(300)
.Name("txtNumeroCarteira")
.MaskRe("[0-9]")
.FieldLabel("N?mero Carteira"),
x.TextField()
.ID("txtNomeConveniado")
.LabelWidth(120)
.InputWidth(300)
.Name("txtNomeConveniado")
.FieldLabel("Nome Conveniado"),
x.TextField()
.ID("txtCodigoAutorizacao")
.LabelWidth(120)
.InputWidth(300)
.Name("txtCodigoAutorizacao")
.FieldLabel("C?digo Autoriza??o"),
x.MenuSeparator()
.Disabled(true)
.Width(700)
.Margin(10)
.Flex(1),
x.FieldSet()
.Flex(1)
.Title("Dados de Pagto.")
.ID("fsDadosPagto")
.Width(600)
.Padding(20)
.Items(
x.TextField()
.ID("txtValorConsulta")
.Margins("0 0 5 0")
.LabelWidth(120)
.InputWidth(100)
.AllowBlank(false)
.Name("txtValorConsulta")
.MaskRe(@"^([1-9]{1}[\d]{0,2}(\.[\d]{3})*(\,[\d]{0,2})?|[1-9]{1}[\d]{0,}(\,[\d]{0,2})?|0(\,[\d]{0,2})?|(\,[\d]{1,2})?)$")
.FieldLabel("Valor Consulta R$"),
x.ComboBox()
.FieldLabel("Forma de Pagto")
.Margins("0 0 5 0")
.AllowBlank(false)
.LabelWidth(120)
.InputWidth(250)
.Items(Model.FormasPagtos)
.ID("ddlFormaPagto")
.Name("ddlFormaPagto"),
x.DateField()
.FieldLabel("Data de Pagto")
.LabelWidth(120)
.InputWidth(100)
.AllowBlank(false)
.ID("dfDataPagto")
.Name("dfDataPagto")
.EmptyText(DateTime.Now.Date.ToString("dd/MM/yyyy"))
.SelectedDate(DateTime.Now.Date)
.Format("dd/MM/yyyy")

)
)
)
)

<script>
Ext.override(Ext.net.InputMask, {
getErrors: function () {
var field = this.getCmp(),
errors = this.fieldGetErrors.call(field, field.processRawValue(field.getRawValue()));

if (errors.length == 0 && field.getRawValue().length == 0 && field.allowBlank)
return errors;

if (!this.isValueValid()) {
errors.push(this.invalidMaskText || field.invalidText);
}

return errors;
},
});

function changeSexo() {
if (window.App.ddlTipoPaciente.getRawValue() == "GESTANTE" || window.App.ddlTipoPaciente.getRawValue() == "LACTANTE") {
var sexo = Ext.getCmp("rblSexo");
sexo.setValue({ rblSexo: "F" });
}
}

function enableDisableButtons(disable) {
if (disable) {
window.App.btnSave.setDisabled(true);
} else {
window.App.btnSave.setDisabled(false);
}


}

function disableFields() {
if (window.App.frmPaciente.getForm().getValues()["rblTipoConsulta"] == 'Particular') {
window.App.ddlConvenio.setDisabled(true);
window.App.ddlPlanoConvenio.setDisabled(true);
window.App.txtNumeroCarteira.setDisabled(true);
window.App.txtNomeConveniado.setDisabled(true);
window.App.txtCodigoAutorizacao.setDisabled(true);

window.App.fsDadosPagto.setDisabled(false);
window.App.txtValorConsulta.setDisabled(false);
window.App.ddlFormaPagto.setDisabled(false);
window.App.dfDataPagto.setDisabled(false);
} else {
window.App.ddlConvenio.setDisabled(false);
window.App.ddlPlanoConvenio.setDisabled(false);
window.App.txtNumeroCarteira.setDisabled(false);
window.App.txtNomeConveniado.setDisabled(false);
window.App.txtCodigoAutorizacao.setDisabled(false) ;

window.App.fsDadosPagto.setDisabled(true);
window.App.txtValorConsulta.setDisabled(true);
window.App.ddlFormaPagto.setDisabled(true);
window.App.dfDataPagto.setDisabled(true);
}
}
</script>



Thank you very much for your help

Ujvari
Mar 12, 2014, 4:31 PM
In the example below if you press Save nothing happens. The error messages working fine but the Submit is not working

8021

Vladimir
Mar 12, 2014, 4:56 PM
Hi,



I did not received an answer for my question yet. I wanna use my Data Annotation Model to show errors and requirements in my form without using javascript to submit the form. I want to submit the form directly to the controller and after the model is validated just show the proper errors in the form.errors in the form.

I already posted such example, it works fine and do what you want (submit form to controller and display validation errors)
http://mvc.ext.net/#/Models/Model_State/

What exactly do you need which is not presented in that example?

About the code which you posted. I see 'SavePaciente' controller action but I don't see anywhere entry point for that action. Why do you expect that form submiting will execute that action. Please define Url for FormPanel like in the online sample


.Url(Url.Action("SavePaciente"))




In the example below if you press Save nothing happens. The error messages working fine but the Submit is not working

I don't see any example (screenshot only). If you mean the following online example then it works fine (i see a message about successful submitting)
http://mvc.ext.net/#/Models/Data_Annotations/

Ujvari
Mar 12, 2014, 5:57 PM
Hi,

Here's my code now. I even put the DataView according to the Model_State example that you send (I don't wanna show a list of errors just errors inside de form) and the Url for the form (My Bad) but it still does not work. I can get to my controller now just fine but the errors were not showed.



x.Panel()
.Title("Dados Paciente")
.ID("pnlDadosPaciente")
.AutoScroll(true)
.Border(false)
.Layout(LayoutType.Fit)
.Items(
x.FormPanel()
.ID("frmPaciente")
.Border(false)
.Layout(LayoutType.Fit)
.Url(Url.Action("SavePaciente","Consulta"))
.FieldDefaults(fd =>
{
fd.LabelAlign = LabelAlign.Left;
fd.MsgTarget = MessageTarget.Side;
fd.InvalidText = "Obrigat?rio";
fd.EnforceMaxLength = true;
fd.AutoFitErrors = true;
//fd.AllowBlank = false;
fd.SelectOnFocus = true;
fd.LabelWidth = 150;
})
.ItemsFromPartial("_DadosPaciente", Model.PacienteModel),
x.DataView()
.Flex(1)
.ItemSelector("li")
.Store(
Html.X().ModelStateStore()
.ID("smPaciente")
)
.Tpl(
Html.X().XTemplate()
.Html(
@<text>
<ul style="list-style-type:circle">
<tpl for=".">
<li style="color:red;">{error}</li>
</tpl>
</ul>
</text>
)
)
)
.Buttons(
x.Button()
.Icon(Icon.DatabaseSave)
.Text("Salvar Paciente")
.ID("btnSave")
.Disabled(true)
.FormBind(false)
.Type(ButtonType.Submit)
.CausesValidation(true)
.Handler(@"#{pnlDadosPaciente}.child('dataview').getStore().r emoveAll(); #{frmPaciente}.submit({clientValidation: false});"),
x.Button()
.Icon(Icon.Erase)
//.Disabled(true)
.ID("btnClear")
.Text("Limpar Campos")
.OnClientClick("#{frmPaciente}.reset();")
).Padding(5),


Here's the controller:



public ActionResult SavePaciente(PacienteModel paciente)
{
if (ModelState.IsValid)
{
X.Msg.Show(new MessageBoxConfig
{
Message = "Salvando Paciente, aguarde...",
ProgressText = "Salvando...",
Width = 300,
Wait = true,
WaitConfig = new WaitConfig { Interval = 200 },
IconCls = "ext-mb-download",
AnimEl = this.GetCmp<Button>("btnSave").ClientID,
});

X.AddScript("setTimeout(function () { Ext.MessageBox.hide(); Sucesso('pnlDadosPessoais','Paciente salvo com sucesso!','Informa??o'); }, 2000);");

}

this.GetCmp<ModelStateStore>("msPaciente").DataBind();

return this.FormPanel(ModelState);
}

Ujvari
Mar 12, 2014, 6:06 PM
Hi,

I found what's wrong. The Field names are not the same as the form field names. It work's because of the ModelStateStore right? How can I use that without using the DataView? As I told you before I just want to show the errors Inside the form not in a list below it.

Thanks

Daniil
Mar 13, 2014, 6:32 AM
The Field names are not the same as the form field names. It work's because of the ModelStateStore right?


Well, yes, a FormPanel's Items has to be configured according to a Model. It is done in the example using an EditorForModel helper.

.ItemsFrom(b => Html.EditorForModel(...))

I think it can be done as you do:

.ItemsFromPartial("_DadosPaciente", Model.PacienteModel)
but you must carry about everything yourself.



How can I use that without using the DataView? As I told you before I just want to show the errors Inside the form not in a list below it.


Please clarify how exactly you want the errors to be shown.

Ujvari
Mar 13, 2014, 2:56 PM
Well, yes, a FormPanel's Items has to be configured according to a Model. It is done in the example using an EditorForModel helper.

.ItemsFrom(b => Html.EditorForModel(...))

I think it can be done as you do:

.ItemsFromPartial("_DadosPaciente", Model.PacienteModel)
but you must carry about everything yourself.



Please clarify how exactly you want the errors to be shown.


I was able to show all the errors inside the form next to each field with no problem but only when I use the ModelStateStore and to use that I had to create a DataView as my code show below. Can I use the ModelStateStore without using the DataView? I don't want a list of errors showing below my form as your example does I just want to show the errors next to each field



x.Panel()
.Title("Dados Paciente")
.ID("pnlDadosPaciente")
.AutoScroll(true)
.Border(false)
.Layout(LayoutType.Fit)
.Items(
x.FormPanel()
.ID("frmPaciente")
.Border(false)
.Layout(LayoutType.Fit)
.Url(Url.Action("SavePaciente","Consulta"))
.FieldDefaults(fd =>
{
fd.LabelAlign = LabelAlign.Left;
fd.MsgTarget = MessageTarget.Side;
//fd.InvalidText = "Obrigat?rio";
fd.EnforceMaxLength = true;
//fd.AutoFitErrors = true;
//fd.AllowBlank = false;
fd.SelectOnFocus = true;
fd.LabelWidth = 150;
})
.ItemsFromPartial("_DadosPaciente", Model.PacienteViewData),
x.DataView()
.StyleHtmlContent(true)
.Flex(1)
.ItemSelector("li")
.StyleSpec("background:white;border:1px solid gray;")
.Store(
x.ModelStateStore()
.ID("smPaciente")
)
.Tpl(
x.XTemplate()
.Html(
@<text>
<ul style="list-style-type:circle">
<tpl for=".">
<li style="color:red;">{error}</li>
</tpl>
</ul>
</text>
)
)
)
.Buttons(
x.Button()
.Icon(Icon.DatabaseSave)
.Text("Salvar Paciente")
.ID("btnSave")
.Disabled(true)
.FormBind(false)
.Type(ButtonType.Submit)
.CausesValidation(true)
.Handler(@"#{pnlDadosPaciente}.child('dataview').getStore().r emoveAll(); #{frmPaciente}.submit({clientValidation: false});"),
x.Button()
.Icon(Icon.Erase)
//.Disabled(true)
.ID("btnClear")
.Text("Limpar Campos")
.OnClientClick("#{frmPaciente}.reset();")
).Padding(5),


Here's my controller



public ActionResult SavePaciente(PacienteViewData paciente)
{
if (ModelState.IsValid)
{

//TODO - IMplement code to save the Paciente

X.Msg.Show(new MessageBoxConfig
{
Message = "Salvando Paciente, aguarde...",
ProgressText = "Salvando...",
Width = 300,
Wait = true,
WaitConfig = new WaitConfig { Interval = 200 },
IconCls = "ext-mb-download",
AnimEl = this.GetCmp<Button>("btnSave").ClientID,
});

X.AddScript("setTimeout(function () { Ext.MessageBox.hide(); Sucesso('pnlDadosPessoais','Paciente salvo com sucesso!','Informa??o'); }, 2000);");

}

this.GetCmp<ModelStateStore>("msPaciente").DataBind();

return this.FormPanel(ModelState);
}

Daniil
Mar 14, 2014, 5:36 AM
Can I use the ModelStateStore without using the DataView?

Yes, you can. A ModelStateStore is just a Store which contains the information about the errors.

Could you, please, clarify why do you use a ModelStateStore?


I don't want a list of errors showing below my form as your example does I just want to show the errors next to each field

I think it can be possible. This should theoretically work .

1. Define some component near a field where you want an error to be appeared.

2. Use a success handler of a submit call.
http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.form.Basic-method-submit

3. In a success handler iterate all the data of a ModelStateStore and put all the errors to the respective components (which you define in the item #1).

Daniil
Mar 14, 2014, 11:11 AM
Also you can try with a FormPanelResult's Errors option.

Ujvari
Mar 14, 2014, 3:11 PM
Also you can try with a FormPanelResult's Errors option.


Now I can't reply to this thread.