Angular 2 Pass Enum to Components Function from HTML - enums

I have created an enum to open up a modal based on whether its an add or an edit modal.
enum ModalTypes {
Add,
Edit
}
public openManageModal(type: ModalTypes) {
if (type == ModalTypes.Add) {
//Open edit modal
}
else {
//Open add modal
}
}
I cant seem to figure out how to call this from HTML. I have tried various things such as openManageModal('Add'), but nothing seems to work. Clearly I can create a function in the component, and parse the string to an enum, but I think this way would be more appropriate. Any help would be appreciated.
Thanks

You should be able to call the function like this:
openManageModal(0) // for ModalTypes.Add
openManageModal(1) // for ModalTypes.Edit
The enum declaration will transpile to the following by the TypeScript compiler:
var ModalTypes;
(function (ModalTypes) {
ModalTypes[ModalTypes["Add"] = 0] = "Add";
ModalTypes[ModalTypes["Edit"] = 1] = "Edit";
})(ModalTypes || (ModalTypes = {}));
So it basically creates an object which looks like this:
{
0: "Add",
1: "Edit",
Add: 0,
Edit: 1
}
So as you can see ModalTypes.Add == 0 and ModalTypes.Edit == 1.

Related

How to write data back to storage?

I have a method called changePlaceName and i know it is working but after i call getPlaces to see the changes, i don't see the new place name instead i see the name when i created a new place.
this is changePlaceName
export function changePlaceName(placeId: u32, placeName: PlaceName): void {
assert(placeId >= 0, 'Place ID must be >= 0');
const place = Place.find(placeId);
logging.log(place.name); //gives "Galata Tower"
place.name = placeName;
logging.log(place.name); // gives "New Galata Tower"
}
I need to save it somehow but I don't know how to do it.
I also tried this way;
export function changePlaceName(placeId: u32, placeName: string): void {
assert(placeId >= 0, 'Place ID must be >= 0');
const place = Place.find(placeId);
logging.log(place.name);
place.name = placeName;
let newPlace = storage.get<string>(placeName, 'new galata tower');
storage.set<string>(placeName, newPlace);
logging.log('New place is now: ' + newPlace);
}
Now my visual code is complaining about the newPlace inside the storage.set
How do I fix it?
What is the code of Place.find? I assume you are using a persistent map under the hood.
Is there a Place.set? You need to store the Place back to the same key used to find it.
because you're using some kind of class to manage the concept of "Place", why not add an instance method to that class to save() the place once you've changed it's name?
would help if you also posted your code for Place here, by the way
my guess is that it looks something like this?
!note: this is untested code
#nearBindgen
class Place {
private id: number | null
private name: string
static find (placeId: number): Place {
// todo: add some validation for placeId here
const place = places[placeId]
place.id = placeId
return place
}
// here is the instance method that can save this class
save(): bool {
places[this.id] = this
}
}
// a collection of places where placeId is the index
const places = new PersistentVector<Place>("p")

Knockout custom validation issue

Say I have a model with following properties:
function ViewModel() {
this.SetupTime = ko.observable();
this.CloseTime = ko.observable();
this.MinHrs = ko.observable();
}
I need to add a validation rule so that MinHrs > (SetupTime + CloseTime). Whenever one of the three fields is changed this validation should fire. I know I have to write a custom validation for this, for example:
ko.validation.rules['ValidWorkRange'] = {
validator: function (val, setuptime, closetime, minhrs) {
return minhrs > (setuptime+closetime);
},
message: '(Shift End - Shift Start) >= Shortest Work Segment'
};
I'm not sure what I have done there is correct, also not sure how to call this validation within the observable.
Can someone please help me out?
Thanks in advance
Yes you are right, you should create a custom validation to achieve your goal. And you have no need to call validation function, it will be automatically called whenever its associated dependency (observables) will change.
Wroking Fiddle
Note : Please apply the other necessary validation like number etc. Because if you enter text in any input field in the fiddle code than result may be an error.
Here is the custom validation code :
var ValidWorkRange = function(val, param)
{
if(val && param){
var minHrs = parseInt(val, 10);
var setupTime = parseInt(param[0](), 10);
var closeTime = parseInt(param[1](), 10);
return minHrs > (setupTime+closeTime);
}
};
And like this you can apply it on your observable :
function ViewModel() {
var self = this;
self.SetupTime = ko.observable();
self.CloseTime = ko.observable();
self.MinHrs = ko.observable().extend
({
validation: {
validator: ValidWorkRange,
message: 'Not valid.',
params: [self.SetupTime, self.CloseTime]
}
});
}
I don't know so much about ko validation but probably it can be usefull for you
https://github.com/ericmbarnard/Knockout-Validation

Uploading images with redactor to MVC

This might be a bit too specific for here and I may need to contact redactor support but i've seen other questions about redactor here so i figured i'd give it a shot ...
Ok ...
So i'm trying to get get image uploading to work following the example here ...
http://imperavi.com/redactor/docs/images/
My client side code ...
$("textarea").redactor({
focus: true,
imageUpload: '/MyController/UploadImage'
});
My MVC controller action looks like this ...
public JsonResult UploadImage(object image)
{
// Do something with whatever that was i got from redactor
var result = new { filelink = "" };
return Json(result);
}
The problem is ... what did redactor actually give me?
Was it the whole file? a chunk? i can't seem to tell because the object has no type information at all and the raw post information seems way too little to actually be a whole image file.
Has anyone had any experience with this / actually done it before?
I don't really want to setup php on my server for this 1 function.
EDIT:
Ok a bit more digging reveals that if i pull the underlying Request object it has a files property which apparently contains my posted image file.
I think i might be able to figure it out from here.
Where I get a code block in place i'll post it as an answer.
You are receiving a HttpPostedFileBase object. Here is my implementation:
jQuery:
$('#blog-post').redactor(
{
imageUpload: '/blog/images/',
imageGetJson: '/images/locations/blogs/'
});
Then in the controller:
public ActionResult Images(HttpPostedFileBase file)
{
// Verify that the user selected a file
if( file != null && file.ContentLength > 0 )
{
// extract only the fielname
var fileName = Path.GetFileName( file.FileName );
// store the file
var path = Path.Combine( ImageLocation.BlogPicturePath, fileName );
file.SaveAs( path );
}
return Json( new { filelink = ImageLocation.BlogPictureUrl + "/" + file.FileName } );
}
ok um ... i think im there ...
This needs a bit of cleaning up and I don't expect you guys to understand what goes on under the bonnet of my custom DMS code but just assume it takes the stream and returns a FileInfo object and in theory this should work for you too ...
public ActionResult Upload()
{
// this object is specific to my system but all it does is
// stream the file to a path on the server (code not needed for this Q)
var dmsService = _kernel.Get<IDMSFileSystemService>();
List<FileInfo> savedFiles = new List<FileInfo>();
for (int i = 0; i < Request.Files.Count; i++)
{
var file = Request.Files[i];
using (file.InputStream)
{
savedFiles.Add(dmsService.AddFromStream(file.InputStream, file.FileName);
}
}
var result = savedFiles.Select(f => new { filelink = f.Path}).ToArray();
return Json(result);
}
Suprisingly simple right ... :)

set value of radcombobox from another combobox

set value of radcombobox2 from another radcombobox1
radcombobox2 is on asp usercontrol & radcombobox1 is on aspx page.
and value is coming from database on time of binding like this
if (result.IsSuccessful)
{
var rcbRadComboBox = (RadComboBox)RadGrid1.MasterTableView.FindControl("RadComboBox1");
if (comboEditAccessGroup != null)
{
comboEditAccessGroup.DataSource = result.Result;
comboEditAccessGroup.DataTextField = "Title";
comboEditAccessGroup.DataValueField = "JobId";
comboEditAccessGroup.DataBind();
}
}
but the problem is that ,i am not able to change selected index which is selected on radcombobox1
I have used
var selectedindexforjob = Request.QueryString["JobId"];
rcbRadComboBox.SelectedValue = selectedindexforjob;
for achieve goal but got failure nothing happens.
please help me.
Radcombobox1====is on aspx page
Radcombobox2=====is on ascx page
Thanks
Add a property to the user control:
public string ComboSelectedValue
{
get { return RadComboBox2.SelectedValue; }
set { RadComboBox2.SelectedValue = value; }
}
And then you can use this property from the page:
MyUserControl.ComboSelectedValue = RadComboBox1.SelectedValue;

kendo inline editing enable and disable fields

How i can enable certain fields on add mode and disable on edit mode. I have add the following code but i unable to enable the description field on add mode. Please advise how I can achieve this?. Thank you
model.fields(p=> p.Description).Editable(false);
I want to enable description on add mode and disable on edit mode. THe following code is not working. Please advise if anything wrong with the code and if any other way to do it. THank you
function onEdit(e) {
var indexCell = e.container.context.cellIndex;
var grid = $('#BTSession').data('kendoGrid');
if (!e.model.isNew()) { // when Editing
if (indexCell != 'undefined' && grid.columns[indexCell].Title == "Description") {
$('#BTSession').data("kendoGrid").closeCell();
}
}
}
There are two problems:
The title is lowercase. The check should be: grid.columns[indexCell].title
isNew() is always false. Alternatively you might check for id being undefined when you add a new record.
Something like:
function onEdit(e) {
var indexCell = e.container.context.cellIndex;
var grid = $('#BTSession').data('kendoGrid');
if (e.model.id) { // when Editing the id is defined
if (indexCell != 'undefined' && grid.columns[indexCell].title == "Description") {
grid.closeCell();
}
}
}
NOTE: If in your model the id column is not called id (lets say myId) use the correct name.
EDIT: See a running example here

Resources