I want to add twitter hastag widget to my application how do I do it. the feature should ask the user to add teh hash tag of the particular thing and add it to his profile page, how do I do that.
Please suggest me the logic and implementation
I finally got the solution for this problem i was able to retrieve feeds from the twitter and post it on my web app, I search for particular hash tag and the feeds of that particular hash tag will be displayed
here is the code,
<script type="text/javascript">
$(document).ready(function() // don't do anything until the document is loaded.
{
$("#submit").click(function(event){ // wire up this as an onclick event to the submit button.
var searchTerm = $("#search").val() ; // get the user-entered search term
var baseUrl = "http://search.twitter.com/search.json?q=%23";
$.getJSON(baseUrl + searchTerm + "&rpp=1500&callback=?", function(data) // call getJSON providing the complete url with search term and a JSONP callback
{
$("#tweets").empty(); // clear out any previous results.
if(data.results.length < 1) // friendly "no results"
$('#tweets').html("No results JOINEVENTUS");
$.each(data.results, function() // iterate over the results;
{
$('<div align="justify"></div>')
.hide()
.append('<img src="' + this.profile_image_url + '" width="80px" /> ')
.append('<span><a href="http://www.twitter.com/'
+ this.from_user + '">' + this.from_user
+ '</a> ' + makeLink(this.text) + '</span>')
.appendTo('#tweets') // append the constructed results HTML to the tweets div
.fadeIn(2000); // fade in the results over 2 seconds.
});
});
});
});
function makeLink(text) // this REGEX converts http(s) links that are embedded in the tweet text into real hyperlinks.
{
var exp = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&##\/%?=~_|!:,.;]*[-A-Z0-9+&##\/%=~_|])/ig;
return text.replace(exp,"<a href='$1'>$1</a>");
}
</script>
</HEAD>
<BODY style="margin-left:20%;margin-right:20%">
<div align="center">
<h2>Twitter tag search</h2>
<div>Enter Search Term</div>
<input type="text" id=search />
<input type="button" id=submit value="Search" />
<DIV id="tweets" />
</div>
</BODY>
Related
I got knockout to work before in MVC, but unfortunately I lost the code, and need help figuring it out.
I am trying to simply put an html page in the ~/wwwsource/ folder of my MVC project, and in that page I would like to demo a simple knockout example.
(Eventually, I actually want to use knockout inside MVC Views, using knockout right alongside Razor if possible but first I just would at least like to get a simple working example going, and extend from there.
I tried the following, which worked in JSFiddle but not in Visual Studio:
<script src="lib/knockout/dist/knockout.debug.js" type="text/javascript">
// Here's my data model
var ViewModel = function (first, last) {
this.firstName = ko.observable(first);
this.lastName = ko.observable(last);
this.fullName = ko.pureComputed(function () {
// Knockout tracks dependencies automatically. It knows that fullName depends on firstName and lastName, because these get called when evaluating fullName.
return this.firstName() + " " + this.lastName();
}, this);
};
ko.applyBindings(new ViewModel("Planet", "Earth"));
</script>
<p>First name: <input data-bind="value: firstName" /></p>
<p>Last name: <input data-bind="value: lastName" /></p>
<h2>Hello, <span data-bind="text: fullName"> </span>!</h2>
You are calling the javascript before the html has been fully rendered. So when ko.applyBindingsis called the html as only partially loaded.
Easiest solution is to wrap the javascript in a document loaded callback using jQuery (which should exist because you're using knockout).
You also have some invalid script tag syntax. Need to close knockout script tag before starting a new one for the page.
<script src="lib/knockout/dist/knockout.debug.js" type="text/javascript">
</script>
<script type="text/javascript">
// Here's my data model
var ViewModel = function (first, last) {
this.firstName = ko.observable(first);
this.lastName = ko.observable(last);
this.fullName = ko.pureComputed(function () {
// Knockout tracks dependencies automatically. It knows that fullName depends on firstName and lastName, because these get called when evaluating fullName.
return this.firstName() + " " + this.lastName();
}, this);
};
$(document).ready(function(){
ko.applyBindings(new ViewModel("Planet", "Earth"));
})
</script>
<p>First name: <input data-bind="value: firstName" /></p>
<p>Last name: <input data-bind="value: lastName" /></p>
<h2>Hello, <span data-bind="text: fullName"> </span>!</h2>
Im trying to create an app that will have fields a user can enter information into. The problem is I don't know how many fields that will be. For example, lets say you have a recipe app where you enter the ingredients in. Some recipes may have 2 ingredients and some may have more. What I am wanting is the option if there are more fields needed than what is on the screen presently, the user can press a add button and it will create the additional fields as needed instead of having some potentially unused fields. I've been looking around trying to find an example of what I'm looking for and not having any luck. Any help would be much appreciated.
best approach will be a UITableView. There you can add as much cell as you need.
There is a apples example though it not as like as you want but you can get the picture.
Hope this helps.. :)
Try this it will help you..
<pre><div id="divingredient" class="input_wrapar_search">
<span>Ivingredient Type : </span>
<input type="text" maxlength="50" id="txtIngredient0" />
</div> </pre>
<script>
var counter = 0;
$("[id$=btnaddnew]").live("click", function (e) {
counter++;
if (counter > 10) {
alert("Can not add more than 10 price !");
return false;
}
$("#divingredient").append('<input type="text" maxlength="50" id="txtIngredient' + counter + '" />');
e.preventDefault();
});
$("[id$=btnremove]").live("click", function (e) {
if (counter == 0) {
alert("one price is manadatory !");
return false;
}
$("#txtIngredient" + counter).remove();
counter--;
e.preventDefault();
});
</script>
<asp:Button ID="btnaddnew" runat="server" Class="btn" Text="Add New" />
<asp:Button ID="btnremove" runat="server" Class="btn" Text="Remove" /></pre>
I have a K-button on kendo grid, when onclick of that button I am expecting to redirect to controller with parameters, but onclick of that button it is not doing anything, even I kept debugger but still no go, it is not at all triggering am I missing anything let me know, I have tried both " and ' along with different format like $(".info").on('click', function ()
CODE
<script id="template" type="text/kendo-template">
#if(ResultFormatID != 3) { #
<input type="checkbox" #= data.Action ? checked="checked" : "" # class=\"check_row\"/>
# } else { #
<input type="button" class="k-button info" name="info" value="Preview" />
# } #
</script>
$('.info').click(function() {
debugger;
var row = $(this).closest("tr");
var item = Grid.dataItem(row);
window.location.href = '/Login/FreeText?profileID=' + rowIDs + '&billid=' + billID;
});
try this code
<a class="info k-button" >Preview</a>
$(document).one('click', '.info', function () {
console.log("clicked");
});
I've created an order form, of which has a large array of fields. I'm now adding coupon functionality so that we can start to give customers discount codes etc.
What's the best way of submitting a single field (the coupon code) using ajax after a "apply coupon" button has been clicked so that the price can be updated on the front end probably using UJS(?) - obviously the final price calculation would happen on the backend?
Cheers.
I would recommend using a JS framework to do Ajax requests. If you JQuery, then you can use the example given to understand how to do a simple post.
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<form action="/" id="searchForm">
<input type="text" name="s" placeholder="Search..." />
<input type="submit" value="Search" />
</form>
<!-- the result of the search will be rendered inside this div -->
<div id="result"></div>
<script>
/* attach a submit handler to the form */
$("#searchForm").submit(function(event) {
/* stop form from submitting normally */
event.preventDefault();
/* get some values from elements on the page: */
var $form = $( this ),
term = $form.find( 'input[name="s"]' ).val(),
url = $form.attr( 'action' );
/* Send the data using post and put the results in a div */
$.post( url, { s: term },
function( data ) {
var content = $( data ).find( '#content' );
$( "#result" ).empty().append( content );
}
);
});
</script>
</body>
</html>
I've been looking at the:
data-filter="true"
option for filtering a list based on what is entered into a search box using Jquery mobile.
I'd like to do the same except hook in the ability to use an ajax get() to populate the list. Does anyone know how to go about doing this or an example anywhere of it being achieved. I've not seen anything on the JQ mobile site.
Thanks.
I couldn't find anything built in that does what you ask, but I was able to achieve this using a simple ajax request and manually filling the list. I started with a text box for the search field, and an empty ul
<div data-role="fieldcontain">
<label for="search">Search:</label>
<input type="search" name="search" id="search" value=""/>
</div>
<ul id="results" data-role="listview">
</ul>
This script block will send an ajax request after each key press, it might be better to add a delay though. It will abort the previous request if still loading and the person types another key. Not perfect, but its a start.
<script>
var last, last_xhr;
var x = $('#search').live('keyup change', function () {
if (last == $(this).val()) return;
last = $(this).val();
$.mobile.showPageLoadingMsg();
if (last_xhr) {
last_xhr.abort();
}
last_xhr = $.get('/Search', { q: last }, function (data) {
last_xhr = undefined;
var list = $('#wines').empty();
$.each(data, function (i, val) {
var el = $('<li data-theme="c" />');
el.append($('' + val.Name + ''));
list.append(el);
});
list.listview('refresh');
$.mobile.hidePageLoadingMsg();
});
});
</script>
The most important bit is calling refresh otherwise it doesn't apply the theme.
list.listview('refresh');