This is a migrated thread and some comments may be shown as answers.
Submit Input Hidden Field
10 Answers 408 Views
This is a migrated thread and some comments may be shown as answers.
chaudary
Top achievements
Rank 2
chaudary asked on 16 Jun 2020, 05:51 PM
I could not find any documentation how to submit hidden field via form control.

Hidden fields will be automatically submitted with the Form when defined through the Items configuration. This configuration is demonstrated in my previous reply.

- by
Dimitar
Telerik team
on 29 Apr 2021, 06:26 AM

10 Answers, 1 is accepted

Sort by
0
Dimitar
Telerik team
answered on 18 Jun 2020, 04:42 PM

Hello,

If the field for which you would like to render a hidden field is part of the model (e.g the model id), then a hidden field for it can be rendered through an editor template as follows:

items.Add()                                     
  .Field(f => f.EmployeeID)
  .Label(" ")
  .EditorTemplate("<input name='EmployeeID' type='hidden' />");

In case you would like to add a custom hidden input to the form, then you can dynamically append the element as follows:

var form = $("#myForm").getKendoForm();

form.wrapper.append($("<input type='hidden' name='customField' value='test' data-skip='true'/>"));

I hope this helps.

Regards,
Dimitar
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
0
Rubencito
Top achievements
Rank 1
answered on 11 Sep 2020, 08:19 AM
This creates an unwanted white-space in the form. Hidden fields should not consume space in the UI on render
0
Dimitar
Telerik team
answered on 15 Sep 2020, 06:51 AM

Hello Rubencito,

There is already a feature request for the MVC/Core Form to provide a built-in method for setting hidden fields.The scenario where there is additional spacing due to the label should be covered with providing such a built-in functionality. Thus, I have upvoted the item on your behalf:

Regards,
Dimitar
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

0
Mahfuzul
Top achievements
Rank 1
answered on 11 Oct 2020, 11:22 AM
Hi Dimitar, So what is the alternative solution for now that does not take up space please?
0
Dimitar
Telerik team
answered on 12 Oct 2020, 06:02 AM

Hi Mahfuzul,

One possible solution is to hide the label in order for the margins to collapse. Each field label has a uniquie id that can be targeted with CSS ([fieldName]-form-label):

.Field(f => f.EmployeeID)                         
  .EditorTemplate("<input name='EmployeeID' type='hidden' />");

...

<style>
    #EmployeeID-form-label { display: none; }
</style>

 

Regards,
Dimitar
Progress Telerik

Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive, special prizes, and more, for FREE?! Register now for DevReach 2.0(20).

0
Mahfuzul
Top achievements
Rank 1
answered on 12 Oct 2020, 08:15 AM

Thanks Dimitar, CSS provided did not do the Job for me for some reason. Its still taking up space. 

I had to hide the parent div as below to completely hide it. 

$(document).ready(function () {
    $("#DailyShiftReportId-form-label").parent().hide();
})
0
Mark
Top achievements
Rank 1
answered on 15 Jan 2021, 09:54 PM

Another more generic option (kendo ui),

$("form").find("input[type=hidden]").parent().parent().hide();
0
Frans
Top achievements
Rank 1
Iron
answered on 20 Apr 2021, 08:05 AM

Hi Telerik,

 

Is this already solved ?

So, when adding a hidden field control item, that it does that without taking space in the UI.

regards,

Martin

0
Dimitar
Telerik team
answered on 22 Apr 2021, 10:27 AM

Hello Frans,

This feature is not yet implemented. For the time being, you can apply additional CSS rule to hide the desired field element.

Regards,
Dimitar
Progress Telerik

Тhe web is about to get a bit better! 

The Progress Hack-For-Good Challenge has started. Learn how to enter and make the web a worthier place: https://progress-worthyweb.devpost.com.

0
Frans
Top achievements
Rank 1
Iron
answered on 28 Apr 2021, 12:54 PM

I found a alternative css solution, like this:

 <style>#myhiddenfield { height:1px;visibility: hidden; }</style>

I know in theory this is not the good css because display:none should be the one that doesnt take space. However, that didnt work., this does work. Only 1 pixel space it still takes.

But this should just be solved anyway, this is a plain bug.

Martin

 

We would advise voting for the feature request Dimitar linked earlier in this thread. The more votes it gets, the higher the chances of it getting approved for implementation in a future release.
- by
Ivan Danchev
Telerik team
on 30 Apr 2021, 07:19 AM
Tags
Form
Asked by
chaudary
Top achievements
Rank 2
Answers by
Dimitar
Telerik team
Rubencito
Top achievements
Rank 1
Mahfuzul
Top achievements
Rank 1
Mark
Top achievements
Rank 1
Frans
Top achievements
Rank 1
Iron
Share this question
or