formatting hash variables in Telerik UI for ASP.NET MVC - kendo-asp.net-mvc

<script id="detail-template" type="text/x-kendo-template">
<div class='shipping-details'>
<ul>
<li><label>Applied:</label>kendo.toString(#= Applied #, "MM-dd-yyyy" )</li>
</ul>
</div>
</script>
I have a DateTime field in my model which I want to format. How do you do this in Telrik's 'UI for ASP.NET MVC' and how do you format kendo # variables in general?
'kendo.' is not recognized in the "text/x-kendo-template", #= Applied # is and displays the full DateTime.

It was a syntax error. The kendo. goes inside the # tags.
#= kendo.toString(Applied, "MM-dd-yyyy") #

Related

TinyMCE Select text area by parent form ID

I was looking at http://archive.tinymce.com/wiki.php/Configuration3x:editor_selector
Is there a way to select a textbox only if it is under a <form> with a specific id?
For example:
<form id="edit_page">
<textarea></textarea>
<form>
I know I can add a class to the text area to get it to work, but I'm hoping for this solution for my use case. As I'm using Active_admin and I don't want to have to redefine all the default forms for it.
If you are okay with using the tinyMCE jquery plugin, you can select the elements using the jquery selector($) and then call the tinymce function over that.
Codepen example is here.
JS Part:
$(function() {
$('#edit_page2 textarea').tinymce({
script_url : 'https://cdnjs.cloudflare.com/ajax/libs/tinymce/4.3.4/tinymce.min.js',
theme : "modern",
mode : "textareas"
});
});
HTML Part :
<form id="edit_page1">
<textarea></textarea>
</form>
<form id="edit_page2">
<textarea></textarea>
</form>
<form id="edit_page3">
<textarea></textarea>
</form>
This will select based on the parent's id. You can use any type of css selector.
You will need to include jquery and tinyMce's jquery file
//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js
https://cdnjs.cloudflare.com/ajax/libs/tinymce/4.3.4/jquery.tinymce.min.js

Selenium Python click a link to javascript in an unordered list

I'm trying to click and activate the javascript link with Selenium. It's for a 5 star rating widget.
five-stars is the exact item below. The other items, IE 4 star are not fully shown.
<div id="percentages_and_ratings">
<div id="percentages">
<div id="rating">
<ul id="personality-rating" class="star-rating profile_rating " onmouseout="Votes.publicStarOut(this)" onmouseover="Votes.publicStarOver(this)">
<li id="current-personality-3198779465475184989-1" class="current-rating" style="width: 0%;"></li>
<li>...
<li>...
<li>...
<li>...
<li>
<a class="five-stars" title="" href="javascript:processVoteNote('vote', 'personality', 5, '222222222222222', false, '', '', Profile.profileHeadingVote);">5</a>
</li>
<li class="cant-tell" style="display: none;">
<li class="click-away">
The selenium unit test output looks like
driver.find_element_by_xpath("(//a[contains(text(),'5')])[2]").click()
but that doesn't work. Selecting the xpath, CSS, HTML with firebug doesn't work either. Any ideas? I've been at it for a few nights now so it's time to ask :-)
I'm using Selenium web driver and python 2.7
Here is how I ended up solving it..
id = self.getID(driver)
script = "$(processVoteNote('vote', 'personality', 5, '"+id+"', false, '', '', Profile.profileHeadingVote));"
driver.execute_script(script)
Based on the sample HTML you posted,
browser.find_element_by_class_name('five-stars').click() should successfully select and click that link. If there is more than one element on the page with that class name on the page, you could use browser.find_elements_by_class_name('five-stars'), iterate through that list to identify the relevant links, and then click them.
If you want to use an XPATH search, I'd recommend using xPath Tester to try out different patterns.

twitter bootstrap date picker not working

I have been extensively searching for the answer but i cant seem to find one that works. I am using Django 1.4, with twitter boostrap 2.0.4 and i am trying to use date picker (eyecon) with no success. When i click on the input box no date box shows up.
<div id="due_date">
<input type="text" value="02/16/12" data-date-format="mm/dd/yy" id="datepicker" >
</div>
At the end of my base.html i have (right before closing the body):
<script src="/site_media/js/jquery.script.js"></script>
<script src="/site_media/js/bootstrap-datepicker.js"></script>
Finally on me jquery.script.js i have:
$(document).ready(function(){ $('.datepicker').datepicker()});
You have selected all elements who have the class "datepicker", while your input element definition does not have such a class but rather has datepicker as id attribute set.
Either select the id field $("#datepicker") or add a class ".datepicker" to your input field.
Do this: $(document).ready(function(){ $('#datepicker').datepicker()});
As you have set id="datepicker"
'.' is used for class and '#' is used for id

Have separate template for each tab without having separate URL - Django

I'm trying to develop a reporting system using Django. I have to display reports about various categories of data.I have put each category as a tab-tab1,tab2, etc. Is it possible to have different template for each tab without having to change the url.
I have tried template inheritance but that requires have separate url for each tab.
My concern is that if the number of tabs grow, then the number of urls will also increase.
Any suggestions please?
Thanks in Advance.
Why is it a problem for the number of URLs to increase?
Presumably you don't need separate URLconf entries for each tab, you can just capture the tab name in the URL and send it on to the view:
url(r'^reports/(?P<tab_name>\w+)/$', views.reports, name='reports')
...
def reports(request, tab_name):
... do something depending on tab_name ...
You can just use {% include %} tag and include different templates.
And I think it's better to have unique URL for each tab, it least with hashtag.
You can use a library like jquery tabs to create the tabs, then load each template individually either through include as suggested by #DrTyrsa or by a custom template tag (which would be my personal preference).
Here is an example (from the excellent bootstrap framework from twitter):
<ul class="tabs">
<li class="active">Home</li>
<li>Profile</li>
<li>Messages</li>
<li>Settings</li>
</ul>
<div class="pill-content">
<div class="active" id="home">...</div>
<div id="profile">...</div>
<div id="messages">...</div>
<div id="settings">...</div>
</div>
<script>
$(function () {
$('.tabs').tabs()
})
</script>

Django: Is there a better way to bold the current page link

I have a base.html template that contains a list of links.
Example:
<div id="sidebar1">
<ul>
<li>Index</li>
<li>Stuff</li>
<li>About Me</li>
<li>Contact Me</li>
</div>
Then I have in my views.py a definition for each of index.html, stuff.html, about.html and contact.html. Each of those templates simply derive from a base.html template and set their own respective titles and contents.
My question is about the above /stuff I have a class="current".
I'd like to make the current page that I'm on have that class attribute.
I could set a different variable in each view like current_page="about" and then do a compare in the template with {% ifequal %} in each class element of each link , but that seems like duplicating work (because of the extra view variable).
Is there a better way? Maybe if there is a way to get the view function name that the template was filled from automatically I would not need to set the extra variable? Also it does seem like a lot of ifequals.
Here's an elegant way to do this, which I copied from somewhere and I only wish I could remember where, so I could give them the credit. 8-)
I assign an id to each of my pages (or all the pages within a section) like this:
In index.html: <body id='section-intro'>...
In faq.html: <body id='section-faq'>...
In download.html: <body id='section-download'>...
And then an id for the corresponding links:
<li id='nav-intro'>Introduction</li>
<li id='nav-faq'>FAQ</li>
<li id='nav-download'>Download</li>
And the in the CSS I set a rule like this:
#section-intro #nav-intro,
#section-faq #nav-faq,
#section-download #nav-download {
font-weight: bold;
/* And whatever other styles the current link should have. */
}
So this works in a mostly declarative way to control the style of the link that the current page belongs in. You can see it in action here: http://entrian.com/source-search/
It's a very clean and simple system once you've set it up, because:
You don't need to mess about with template markup in your links
You don't end up using big ugly switch statements or if / else / else statements
Adding pages to a section Just Works [TM]
Changing the way things look only ever means changing the CSS, not the markup.
I'm not using Django, but this system works anywhere. In your case, where you "set their own respective titles and contents" you also need to set the body id, and there's no other Django markup required.
This idea extends easily to other situations as well, eg. "I want a download link in the sidebar on every page except the download pages themselves." You can do that in CSS like this:
#section-download #sidebar #download-link {
display: none;
}
rather than having to put conditional template markup in the sidebar HTML.
Haven't used Django, but I've dealt with the same issue in Kohana (PHP) and Rails.
What I do in Kohana:
<li><a href="/admin/dashboard" <?= (get_class($this) == 'Dashboard_Controller') ? "class=\"active\"" : NULL ?>>Dashboard</a></li>
<li><a href="/admin/campaigns" <?= (get_class($this) == 'Campaigns_Controller') ? "class=\"active\"" : NULL ?>>Campaigns</a></li>
<li><a href="/admin/lists" <?= (get_class($this) == 'Lists_Controller') ? "class=\"active\"" : NULL ?>>Lists</a></li>
What I do in Rails:
<li><a href="/main" <%= 'class="active"' if (controller.controller_name == 'main') %>>Overview</a></li>
<li><a href="/notifications" <%= 'class="active"' if (controller.controller_name == 'notifications') %>>Notifications</a></li>
<li><a href="/reports" <%= 'class="active"' if (controller.controller_name == 'reports') %>>Reports</a></li>
I see only a couple of ways of doing it, while avoiding repeated ifequals:
Javascript. Something along the lines of (jQuery):
var parts = window.location.pathname.split('/');
var page = parts[parts.length-1];
$('#sidebar1 a[href*=' + page + ']').addClass('current');
Change your views to contain a list of pages with their associated titles and URLs and create a {% for %} loop in your template, which will go through that list, and add a single {% ifequal %}.
Option 2 being the favorite from where I stand. If the logic for all of your pages is the same, and only the templates differ, you might consider using the FlatPages model for each of your pages. If the logic is different, and you need different models, you might consider using a menuing app of some sort. A shameless plug: I have a menuing app of my own
If you add the request context processor, it's pretty straightforward:
settings.py:
TEMPLATE_CONTEXT_PROCESSORS = (
'django.core.context_processors.request',
'django.contrib.auth.context_processors.auth' # admin app wants this too
)
Now you have access to the HttpRequest, which contains the request path. Highlighting the current page is a simple matter of checking if the path matches the link's destination, i.e., you're already there:
<li><a class="{% if request.path == '/' %}current{% endif %}" href="/">Index</a></li>
<li><a class="{% if request.path == '/stuff/' %}current{% endif %}" href="/stuff/">Stuff</a></li>
<li><a class="{% if request.path == '/about/' %}current{% endif %}" href="/about/">About Me</a></li>
<li><a class="{% if request.path == '/contact/' %}current{% endif %}" href="/contact/">Contact Me</a></li>