We Keep Coding

Is it possible to concatenate an img src in React?

This might be a silly question but I'm trying to concatenate the source of an image in React to be rendered on the screen, but it's not working.
<img src=`https://www.cryptocompare.com/{this.state.cryImage}` />
In this.state.cryImage, I only get the second half of the link (I'm pulling data from an API) so for example it would be something like:
media/19633/btc.png
Am I concatenating incorrectly or is this just not possible?

You've missed $ sign and brackets for attribute
<img src={`https://www.cryptocompare.com/${this.state.cryImage}`} />

You forgot to add {} in src prop:
<img src={`https://www.cryptocompare.com/${this.state.cryImage}`} />

Find elements by attribute's partial value

I have some img tags inside iFrame(id=iframe1) on my page.
Some of them has src attribute set to myimg.jpg, 'myimg_small.jpg', myimg_large.jpg etc.
I am trying to find everything inside #iframe1 with src like myimg, so I wrote
images = $('#iframe1').contents().find('[src*="myimg"]')
but I am getting error as below
Uncaught Error: Syntax error, unrecognized expression:
[src*="myimg"])
at Function.Sizzle.error (jquery-1.8.2.js:4679)
at tokenize (jquery-1.8.2.js:4739)
at select (jquery-1.8.2.js:5099)
at select (jquery-1.8.2.js:5276)
at Function.Sizzle [as find] (jquery-1.8.2.js:3941)
at init.find (jquery-1.8.2.js:5372)
at <anonymous>:1:36
What's wrong here?
Update
alert($('#if').contents().find('[src*="ss"]').next().html());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<iframe id='if'>
<img src='sss.jpg' />
<div>
scdscd
</div>
</iframe>

Simply do:
var x = $("img[src$='myimg.jpg']");
alert(x.attr("src"));

Use contains selector, and as Enfyve mentioned in comments remove extra ).
images = $('#iframe1').contents().find('[src~="myimg"]')

You are wrong about using an iframe.
The iframe must use the src attribute and use it to load the contents of other pages. An iframe does not need to include its child elements directly in its tag.
You can try this.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<iframe id='if' src="1.html">
</iframe>
//1.html
...
<img src='sss.jpg' />
<div>
scdscd
</div>
and you can try as following.
alert($('#iframe1').contents().find('[src*="ss"]').next().html());

Selector is correctly working. You can see working jsbin here.
Incorrect usage of iframe is causing issue for you.
If you want add contents to iframe either you have to specify URL using src attribute or HTML string using srcdoc attribute.
The srcdoc attribute specifies the HTML content of the page to show in the inline frame.
Reference iframe srdoc

make sure that your iframe src is targeting the same domain as your main page. Otherwise you are not allowed to access iframe content. This is called XSS (Cross Site Scripting) and it's prevented by major browsers.
If your iframe source is on the same domain and you still can't access it's content make sure to set a setTimeout waiting for iframe content to be loaded because iframe content start loading after the main page is loaded.

Change ng-src value onclick

I've an AngularJS page and I want it to change ng-src value of an element when clicking on another element. I intialized variable src:
data-ng-init="src='assets/img/projects/1'
Then I made this element:
<img data-ng-src="{{src}}/1.jpg" id="img1">
And finally I want when someone clicks on my link, It change that src to {{src}}/1a.jpg, So I tried this:
(Don't care about my empty link, I know how to click on it...), My problem is, The value of src doesn't change and My page is still the first image, How can I improve my code to change value {{src}}/1.jpg to {{src}}/1a.jpg?

Very very wrong code, You combine standard DOM modification with angular. Choose only one solution not combine in this way. Check my example code:
var app=angular.module("image",[]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="image" ng-init="src='https://www.gravatar.com/avatar/161dac2e231b0f6b4340000328e18bcf?s=328&d=identicon&r=PG&f=1'">
<img data-ng-src="{{src}}" id="img1">
<button ng-click="src='https://www.gravatar.com/avatar/a5af44879d481c3c15a4b2dd55007322?s=328&d=identicon&r=PG'" >Change image src to different</button>
</div>
So only set src scope variable to different src and it works like a charm.
ng-click="src='different src'"

Create new varibale image
data-ng-init="src='assets/img/projects/1'; image='1.jpg'"
Then HTML Element
<img data-ng-src="{{src}}/{{image}}" id="img1">
If someone clicks on you link the change the image value
Hope this helps ! Thanks.

Set ng-click to function in your controller, that changes "src" variable in your scope.

How I can create a button for save a image with Javascript or any Javascript framework?

I would like save with a button a generated picture. I see the fastest solution is JavaScript, probably JQuery or any framework.
My application generate a img label, for example:
<img src = "data:image/png;base64,iVBORw0KGgo...(it's very long)"/>
The many problem is the src attribute because change for my application, first I need catch the URL of this.
Thank you very much!

You can use the download attribute in HTML. If the img src is automatically generated, you could use the script below to put it in the href:
$('#save').prop('href', $('img').prop('src'));
<img src="http://blog.grio.com/wp-content/uploads/2012/09/stackoverflow.png"/><br/>
<a id='save' download>Save</a>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Whether DOM property will work for Phone Gap android?

I am working on a Phonegap android project.
I would like to know whether the DOM property will work for Phone Gap or not.Because,I tried implementing a condition such as
if(results.rows.item(val[1]).COLUMN_NAME==="")
{
document.getElementById("ID").src="img/abc.png";
console.log("abc image to be changed"+val[1]);
}
else
{
document.getElementById("ID").src="img/abc1.png";
console.log("no change "+val[1]);
}
HTML CODE:
I tried executing the program in 2 of the following cases in HTML
CASE 1:
<div id="ID" > <img src="img/abc1.png" onclick="abc()" /></div>
CASE 2:
<div id="ID" > <img src="" onclick="abc()" /></div>
when i run the program the Console statement is being displayed,but there is no change in the image.
AM I RIGHT IN THE WAY OF IMPLEMENTATION?
please guide.

div doesn't have the attribute src. so you need to give the id to img tag to change the src of image like that:
<div> <img src="img/abc1.png" id="ID" onclick="abc()" /></div>
Or you can change the image by the innerHTML property like this:
document.getElementById("ID").innerHTML = '<img src="img/abc.png" onclick="abc()" />';
Use any one which you want.

div tag does't have any src attribute .src attribute is img tag property . so get that id inside img tag . then only you can change the src attribute