get content in view from ContentBinding - view

I've got problem with new Ember.js (1.0 pre)
I got something what worked on Ember 0.9.8 but when I changed version of this lib I noticed problem which can't resolve. (I'm not so good at Ember :/)
Here is sample code:
http://jsfiddle.net/ETQCc/5/
I created view:
<script type="text/x-handlebars" data-template-name="MyView">
{{s}} / {{content.s}} / {{this.s}} / {{view.s}}
</script>
App.myview = Em.View.extend({
layoutName : "MyView",
});
And I'd like to show some varible which depends on what I set in content bindig:
<script type="text/x-handlebars">
xx{{view App.myview contentBinding="App.ctrl"}}
</script>
How to get to varible in this controller?

You have two ways to do that.
You can :
bind the controller to your view instead of binding the content (see the JSFiddle). By doing that you set the context of the view to be the controller, so {{s}} works directly:
{{view App.myview controllerBinding="App.ctrl"}}
edit your template to get the variable from the view instead of its context (see this JSFiddle). By doing that the view content is binded to the controller, and your template shows the s property of the view content:
{{view.content.s}}
I suggest you to take a look at Ember.js View Context changes.

I found the answer...
I should use:
{{view.content.s}}

Related

OpenUI5: Issue with adding a view to an element

I try to include an HTML-View in a XML-View which actually shouldn't be a problem. Unfortunately the content of the HTML-View is not added to the site. An error is not thrown.
In the XML-View I have a placeholder for the HTML-View:
<html:div
id="helptext">
</html:div>
In the controller of the XML-View I instantiate the HTML-View and add it to the placeholder:
var oController = sap.ui.controller("dividendgrowthtools.view.textviews.dividendcomparehelpDE");
var oTextView = sap.ui.view({
viewName: "dividendgrowthtools.view.textviews.dividendcomparehelpDE",
controller: oController,
type: sap.ui.core.mvc.ViewType.HTML
});
var oHelpText = this.getView().byId("helptext");
oTextView.placeAt(oHelpTextDiv.sId);
That's the content of the HTML-View:
<template data-controller-name="dividendgrowthtools.view.textviews.dividendcomparehelpDE">
<p>This is a test.</p>
</template>
Does anybody have an idea what the problem could be?
you need to be aware of the functionality of this.getView().byId();
SAPUI5 generates another ID then the one you specified in the XML-View("helptext") see:
So you need to pass the right ID. You need to be aware that these ID could possibily change, when you refactor the XML structure.
I would recommend you, not to use HTML elements in SAPUI5.
Some helpful links:
https://scn.sap.com/thread/3551589
https://plnkr.co/edit/wDBpQuxIWd0WGOoyulN0?p=preview (made by me)PLnkr Link

Asp MVC AjaxExtensions, call from controller

I'm sure this is simple but I'm struggling to find it
Inside a controller you can do something like this:
public ActionResult MyAction()
{
string url = Url.Action(action, controller),
// do something with the url
}
What's the Ajax equivalent? i.e. where you would call Ajax.ActionLink in a View whats the equivalent for the controller?
Elaboration-
I have a master/detail arrangement with a grid and some input elements. You can click on select/delete in the grid to amend or delete the line.
The grid is a Kendo UI grid, the view is rendered via:
a partial view to render the input elements
creating a json object, i.e.
#{
var jsLines = #Html.Raw(Json.Encode(Model.Lines));
}
Binding the Kendo grid to this json
From within the grid I want to hit on select and call an Ajax method to update the partial view with the form details
thanks
You can use Url.Action from the razor view. Something like :
$.ajax({
url: '#Url.Action("Action", "Controller")',
...
I'm not at all convinced that this is the right way to go but it's always good to have options.
Ajax.ActionLink seems to be the same as Url.Action but with a few attributes thrown in. So you can use this:
return string.Format("<a data-ajax='true' data-ajax-mode='replace'
data-ajax-update='{2}' href=\"{0}\">{1}</a>",
Url.Action(action, controller, routeValues),
text,
"formContainerSelectSection");
to update this:
<div id="formContainerSelectSection">
... stuff to be replaced via ajax
</div>
I accept, especially after the discussion with NicoD, that there are other and probably easier ways to do this, in particular this is creating a link in the controller, that's the Views job, but the original question was about how to do this

Ember.js - child nested views' controller

I'm building a simple calendar app with Ember. My views are nested this way :
<script type="text/x-handlebars" data-template-name="calendar">
{{content.monthAsString}}
{{#each day in content.days}}
{{view App.DayView contentBinding="day"}}
{{/each}}
</script>
<script type="text/x-handlebars" data-template-name'="calendarDay">
{{content.date}}
</script>
My JS code :
App.CalendarController = Ember.ObjectController.extend({
content:App.Calendar.create(...);
oneDayHover:function(day){
}
});
App.CalendarView = Ember.View.extend({
templateName:"calendar"
});
App.CalendarDayController = Ember.ObjectController.extend({
dayHOver:function(){
//???? HOW TO ACCESS CalendarController?????
}
});
App.CalendarDayView = Ember.View.extend({
templateName:"calendarDay",
init:function(){
this._super();
this.set('controller', App.CalendarDayController.create());
},
mouseEnter:function(){
this.get('controller').dayHover();
}
});
Problem 1:
Isn't there a nicer solution than to override the init method of the view to set it's controller?
Problem 2:
How can I access the oneDayHover of CalendarController from the CalendarDayController?
Thanks in advance for the help
Update 1:
I should remark that those controllers exists in the same state. The point of the mouseenter is to display a popup on top of the CalendarDayView containing extra information.
1 - Do not assign Controllers to Views manually. Let Ember do the heavy Lifting! Have a look at Embers Router API / how to define routes. Routes will connect controllers and views and render them (Doc).
2 - If you follow point 1, your other problem will get easy with Embers way of dependency injection:
App.CalendarDayController = Ember.ObjectController.extend({
needs : ["calendar"],
dayHOver:function(){
//Access the single instance of CalendarController
var calendarController = this.get("controllers.calendar");
}
});
Update in response to Comment:
The CalendarRoute is created implicitly. Therefore all you would need to do, is modifying your template, i guess:
<script type="text/x-handlebars" data-template-name="calendar">
{{content.monthAsString}}
{{#each day in content.days}}
{{control "calendarDay" day}}
{{/each}}
</script>
As you see, i am suggesting the use of the {{control}} helper. What the code above basically says is :
"Dear Ember, please use the name 'calendarDay' to lookup
App.CalendarView and App.CalendarDayController and use them to render
the object day"
Additionally you have to tell ember, that it should not use the controller as singleton (which is the defaul behaviour):
App.register('controller:calendarDay', App.CalendarDayController, {singleton: false });
Note: I have not yet used the control helper myself, but this should be the way it works.

Fanycbox 1.3.4 ajax issue with ASP.NET MVC

I'm using Fancybox 1.3.4 with ASP.NET MVC 3.
I have following link :
<a id="various" href="Like/List/#feed.Id" class="petlikeCount liked">#feed.LikeCount</a>
and also jquery :
<script type="text/javascript">
$(document).ready(function () {
$("#various").fancybox({
type: 'ajax'
});
});
</script>
Controller action in Like controller :
public JsonResult List(int id)
{
return Json("success", JsonRequestBehavior.AllowGet);
}
My problem is that Like/List is never called (checked with the breakpoint) and fancybox just appears and show content of "parent" page....
I also tried with iframe content returning pure html back, but I'm getting same strange behavior as above.
Thank you in advance!
I'd recommend you using HTML helpers instead of hardcoding anchors:
#Html.ActionLink(
feed.LikeCount,
"List",
"Like",
new { id = feed.Id },
new { id = "various", #class = "petlikeCount liked" }
)
Another thing that you should make sure is that the feed.Id is actually an integer variable so that when the List action is invoked it is correctly passed this id.
So your url should look something like this: /List/Like/123. And then assuming tat you have kept the default route and haven't messed up with some custom routes, the List action should be called and passed the correct id as argument.
Also I would very strongly recommend you using a javascript debugging tool in your browser such as FireBug in which you will be able to see any potential errors with your scripts as well as the actual AJAX requests being sent which will allow you to more easily debug such problems.

asp.net mvc partialview #Ajax.ActionLink doesn't work

I have a view page
my view page
<div id="beReplaced">
#Ajax.ActionLink("please click on me to bring the partial view",
"PatrialViewToBeCalled",
new AjaxOptions()
{UpdateTargetId = "beReplaced",
InsertionMode = InsertionMode.InsertAfter,
HttpMethod="Get",
LoadingElementId = "prgress" })
</div>
i have a Controller
public PartialViewResult PatrialViewToBeCalled()
{
var customer = db.Customers.First();
return PartialView("PartialViewThatMustBeShow",customer);
}
but when i click on the generated link it brings me to a new page instead of
replacing or appending the partial view to the div tag.
What's the problem?
It could have been that you were missing the:
<script src="#Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
In the main view. This tells the main view to recognize the ajax helper.
I found the solution. The problem was due to the corrupted unobtrusive-ajax.min.js file.
If you have jQuery loaded into your page, why not use the simple jquery get / load method to get the partial view ?
<div id="beReplaced">
please click on me to bring the partial view
</div>
Javascript
$("#lnk1").click(function(){
$.get('/controller/PatrialViewToBeCalled', function(data) {
$('#beReplaced').html(data);
});
});
If you are working with ASP .NET MVC 4 make sure that
#Scripts.Render("~/bundles/jquery")
is in the end of the body tag as well.
#Scripts.Render("~/bundles/jquery")
#RenderSection("scripts", required: false)
</body>
</html>
I've just been working on it for too long, thinking it did not work. Viewing the page source didn't show anything either.
Eventually, I found out it actually did work when I saw the successful requests in the console of Firebug. It only was showing it off screen. In the HTML tab of Firebug I finally found the output, even though it does not show up in the page source.

Resources